Vuetify: [Feature Request] I want close the <v-edit-dialog> decide by myself when click the 'Save' button.

[DeFenceD]

Problem to solve

In reality, I want do some thing like request promise, and wait there are finish, then close the or keep the alive.
But now, I find when I click the 'Save' button, I can't prevent close by any code.
Since I was offer the '@save' event, I hold decide call the method 'close()' by myself.

Proposed solution

Hold decide call the method 'close()' by myself.

[nickfaughey]

Is there any possible workaround for this until a decision is reached on whether to implement? I'd like to do some validation on a <v-combobox> that I have in a <v-edit-dialog> after the user clicks Save or presses Enter and conditionally block the edited data from propagating back to the data table's v-model. The save() event on the <v-edit-dialog> passes no parameters - something similar to e.preventDefault() would be perfect.

[nickfaughey]

I've tried preventing the keypress event (@keydown.enter.prevent), and tried poking into the component to attempt to force it to stay open:

<v-edit-dialog ref="editDialog" @save="onSave">

save() {
    this.$refs['editDialog'].isActive = true;
}

Neither works, and the v-edit-dialog still closes and propagates the data back to the table. May need to recreate the v-edit-dialog as a custom v-dialog to get this capability, as it seems like the v-edit-dialog is intended for simple inline edits without much logic.

It actually looks like the save() event is fired after the value is saved, so maybe a long-term goal would be adding a pre_save() event that could cancel the save.

Edit: Looks like an old PR that would have solved this has since died: https://github.com/vuetifyjs/vuetify/pull/5406

[makana]

What about passing the save() or a close() method or the isActive property to the input slot? So you can fully rely on the events of your field instead of the save event or return value of the dialog and manually close the dialog with custom logic.

For example I want to trigger an ajax call after a value is selected from a v-select using the @input event of the field and close the dialog after everything is done. Seems impossible atm, so I have to work with the large dialog version...

[oawebdev]

Have you found the solution? I've the same problem.

[johnleider]

All v-edit-dialog is going away. If we do something similar in v3, it will look nothing like it does now.

If you have any additional questions, please reach out to us in our Discord community.