SAB Form

Quote from SAB

The plugin is applied like that:

1. Search for an send tag inside the page
2. If found, get the parent form tag and add all the inputs to the form config
3. Add the forms.js and the config to the view
4. In forms.js for each form, form.js is used as compoent mounted to the respetive form element.
   This file has the child component send.vue, what will cause to render the send tag as vue component.

You don't have to add v-show to the error slot, as it is only shown if status == 3

HTML: send.vue

1. <template>
2. <button :class="class" type="submit" :disabled="status > 0">
3. <slot v-if="status == 0">
4. {{ 'Send' | trans }}
5. </slot>
6. <slot name="sending" v-if="status == 1">
7. {{ 'Sending' | trans }}
8. </slot>
9. <slot name="success" v-if="status == 2">
10. {{ 'Sent' | trans }}
11. </slot>
12. <slot name="error" v-if="status == 3">
13. {{ 'Unable to send mail.' | trans }}
14. </slot>
15. </button>
16. </template>

Display More

Hi Simon,

that's where I was attempting to include the modal status screen first, but I was unable to do that from there. Error can happen so why not let it be there? The only thing I would improve on the solution would be a sexy "sending" status in the modal, that feels more like uikit integrated solution a progress bar for example. Then it should be fine it is, and can be easy customized.

Regards,

Sven