Menu
I have used modal-ok slot available in b-modal slots to render the OK button of b-modal. I want to conditionally disable the OK button. I have tried 2 methods with no luck. Any suggestion is welcome on how to disable the OK button rendered using the slot.
Disabled prop
<div
slot="modal-ok"
:disabled="true"
@click.stop="uploadFile(item.id)"
>
Upload
</div>
ok-disabled prop of b-modal
<div
slot="modal-ok"
:ok-disabled="true"
@click.stop="uploadFile(item.id)"
>
Upload
</div>
892
<b-modal> supports close on ESC (enabled by default), close on backdrop click (enabled by default), and the X close button in the header (enabled by default).
There are few ways to close modal in Bootstrap: click on a backdrop, close icon, or close button. You can also use JavaScript hide method. Click the button to launch the modal. Then click on the backdrop, close icon or close button to close the modal.
By default, dialog can be closed by pressing Esc key and clicking the close icon on the right of dialog header. It can also be closed by clicking outside of the dialog using hide method. Set the closeOnEscape property value to false to prevent closing of the dialog when pressing Esc key.
To close a modal using vue. js you can use the click event i.e. @click to trigger change in modal visibility. So, whenever the close button is pressed the @click method will trigger the function associated with the action ( here, hiding the modal ).
Use the ok-disabled prop on <b-modal>, to conditionally enable/disable the ok button.
<b-modal :ok-disabled="true">
<!-- Content -->
</b-modal>
For more information check out this section of the documentation.
140
Just add hide-footer if you want to get rid of the buttons
<b-modal hide-footer>
<!-- Content -->
</b-modal>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
