How to submit form loaded into BootstrapDialog Modal

Question

I loaded my edit page into a modal dialog using BootstrapDialog https://github.com/nakupanda/bootstrap3-dialog but how do I get the submit button from the BootstrapDialog to submit the form?

Here is a fiddle of the problem. http://jsfiddle.net/philphil/ru1t1nc6/15/

Edit Page

<form id="createEventForm" action="http://10.10.15.30:8000/attendee/edit" style="display:none" method="POST">
    <label for="first_name">First_name:</label>
    <input name="first_name" value="Chris" id="first_name" type="text" />
    <label for="last_name">Last_name:</label>
    <input name="last_name" value="Griffin" id="last_name" type="text" />
    <input type="submit" />
</form>

JQuery

 $(document).ready(function () {

    var form = $('#createEventForm').html();
    BootstrapDialog.show({
        title: 'Title',
        message: form,
        buttons: [{
            label: 'Update'
        }]
    });

});

sorry i made a simplified version of my form for the fiddle. the problem still remains how do i submit it from the other button. — Phil, Dec 18 '14 at 22:58
you could try to serialize the form on button click: see http://stackoverflow.com/questions/16154216/twitter-bootstrap-modal-form-submit — blurfus, Dec 18 '14 at 23:00

score 1 · Accepted Answer · answered Dec 18 '14 at 23:04

How about adding an action to your button:

http://jsfiddle.net/ru1t1nc6/17/

    BootstrapDialog.show({
        title: 'Title',
        message: form,
        buttons: [{
            label: 'Update',
            action: function(dialog) {
                // submit the form
                $('form').submit()
            }
        }]
    });

How to submit form loaded into BootstrapDialog Modal

1 Answers1