CODEWITHSUNDEEP
jquerymodal-dialog
Zoran
Zoran

Reputation: 1371

modal confirmation - form not submitted if ok is clicked

I have the multiply forms (automatically generated) on the page. I am asking the user to confirm record deletion. If user click on no, modal dialog is closed and nothing happen, however if he click on yes button, nothing happen again. Anyone can help?

Here is the code:

 <input type="submit" value="Click me" class="button" />

 <div id="modal">
<div id="heading">
    Record will be deleted! Please Confirm.
</div>

<div id="content">
    <p>Record will be deleted! This operation can't be undone. <br />Are you sure?</p>

    <input type="button" onclick="return true;" class="button green close" value="Yes"></button>
    <input type="button" onclick="return false;" class="button red close" value="No"></button>

</div>


$('.oneUser').on('submit',function(e){
    $('#modal').reveal({ 
        animation: 'fade',                   
        animationspeed: 600,                       
        closeonbackgroundclick: true,           
        dismissmodalclass: 'close'    
    });
    return false;
});

Upvotes: 1

Views: 2424

Answers (1)

Nicodemeus
Nicodemeus

Reputation: 4083

Updated, now with a A fiddle!

Updated markup

<form>
    <input type="submit" value="Click me" class="button" id="submitButton" />
</form>​
  • Dialog markup removed.
  • Included form markup.

Updated script

var confirmDelete = $('<div></div>')
    .html('Record will be deleted! This operation can\'t be undone. <br />Are you sure?')
    .dialog({
        autoOpen: false,
        title: 'Record will be deleted! Please Confirm.',
        buttons: {"Yes": function() { 
                      $(this).dialog("close"); 
                      $('form').submit();
                 }, "No": function() {
                      $(this).dialog("close");
                 }
        }
    });  
$('#submitButton').on('click', function(e){
    e.preventDefault();
    $(confirmDelete).dialog('open');
});
  • Uses the button's click event rather than the form's submit event.
  • Implements the dialog like this guy did it.
  • Yes and No options will close the dialog and clicking 'yes' will also invoke $('form').submit();.

Upvotes: 1

Related Questions