QPopupEdit inside QTable programmatic canceling doesn't work



  • I needed to have custom buttons inside q-popup-edit and I’m trying to cancel the pop up on button press but it just doesn’t work. It does absolutely nothing.
    What am I missing?

    <q-popup-edit v-model="props.row.title" ref="popupEdit">
      <q-input v-model="props.row.title" dense autofocus counter />
         <div class="q-gutter-sm">
            <q-btn outline color="primary" label="Submit" />
    	<q-btn outline color="red" label="Delete" />
    	<q-btn flat color="primary" label="Cancel" @click="cancel"/>
         </div>
    </q-popup-edit>
    

    Here is my cancel method:

    this.$refs.popupEdit.cancel()



  • Not sure why the ref isn’t working, but the formal way to do your own buttons is to use the default scoped slot and it’s props, which offer you the set and cancel methods.

    https://quasar.dev/vue-components/popup-edit#Default-scoped-slot

    Scott


Log in to reply