How to make a form submit by clicking on button on a BootstrapDialog ?

[steathy]

I put js function to submit form in button attribute "action" but couldn't get it worked.

Something like: (note form is not rendered inside dialog)

BootstrapDialog.show({
        title: 'Warning',
        message: 'are you sure of submitting this form?',
        type: BootstrapDialog.TYPE_WARNING,
        buttons: [ {
            label: 'YES',
            cssClass: 'btn-primary',
            action: function(){
                $('#form').submit()
            }
        }, {
            label: 'NO',
            action: function (dialogItself) {
                dialogItself.close();
            }
        }]
    });

However I could call $('#form').submit() in chrome console and it got executed correctly.

[mobspyguy]

I had the same problem and resolved with a simple trick. Into your #form element add an invisible submit button.

<form data-ajax="dialog">
	-- YOUR FORM --
	<button type="submit" name="save" class="hide"></button>
</form>

Then use (emulates button click):

buttons: [{
	action: function(dialog){
		$('button[type="submit"]', $(dialog.getModalBody())).click();
	}
}]

If you want handle the submit event into dialog, then define message as a function.

message: function(dialog) {
	var $message = $('<div />');
	var complete = function(){
		$message.on('submit', 'form[data-ajax="dialog"]', function(event){
			-- Do your own Ajax Request --
			dialog.close();
		});
	});
        //Load your form from URL
	$message.load("http://example.com/form.html", null, complete);

	return $message;
},