Modal box when submitting the form

Modal box when submitting the form

I want to show modal box confirmation before submitting the form. how can I do that?

I have a code like below, which will get data in input and will check in database, if data is already exist. but how can I have a confirmation modal when condition is false and form is ready to submit?


  1.     $(function(){
  2.         $('#my-submit-button').on('click', function(){
  3.             $.post("http://domain.com.ph/portal/reports/home_members/ajax_chassis_no/",
  4.             $('#my-form').serialize(),
  5.             function(result){
  6.                 if($.trim(result) != ''){
  7.                     alert(result);
  8.                 } else {
  9.                     //No error, submitting the form now to its action "save.php"
  10.                     $('#my-form').submit(); <-------- Must have confirmation before submit the form.
  11.                 }
  12.             });
  13.             //form will not wait for the ajax response and will be submitted, so by default stop submitting the form
  14.             return false;
  15.         });
  16.     });


Here's modal box I made.


  1. <script type="text/javascript">
    $('#modal-dialog').on('show', function() {
        var link = $(this).data('link'),
            confirmBtn = $(this).find('.confirm');
    })


    $('#btnYes').click(function() {
     
        // handle form processing here
       
        alert('submit form');
        $('#my-form').submit();
     
    });
    </script>