How to use dynamic html content within the dialog message?
adam-jones-net opened this issue · 1 comments
I'd love to be able to use this plugin to handle a couple of drop down boxes that are being populated by ajax and where the second drop down box refreshes each time a change is made to the first one.
To start testing this idea I made the following sample inspired by code from the vue documentation here which generates a select list and then should dynamically update a label next to it each time the select value changes.
let options = {
html: true,
reverse: true,
okText: 'Submit',
cancelText: 'Cancel',
animation: 'zoom',
backdropClose: true
};
this.$dialog.confirm('<select v-model="selected"> <option disabled value="">Please select one</option> <option>A</option> <option>B</option><option>C</option></select><span>Selected: {{ selected }}</span>',options).then(function () {
console.log('Clicked on submit')
})
When my dialog opens the select box is present but the dynamic text never updates, it just reports
Selected: {{ selected }}
Is what I'm trying to achieve possible via vue tags such as {{}} and its just that I've not implemented correctly or is this going to be a real mess and outside of the purpose of the plugin ?
Please use custom component for custom functionalities