Unable to use modal for confirmation when submitting form

I used a modal using bootstrap and the form is submitted using a modal yes or no submit button, but when I used the modal window code inside the form then it was sent to the yes button but outside the form if I used the modal sent by clicking "Yes".

GSP Code

  <g:form url="[resource: holidaysInstance, action:'delete']" method="DELETE" onSubmit="return modalwindow(this)">
  <input type="submit" class="btn bg-danger button_delete deleteHoliday" value="Delete"/>
  </g:form>
  Js are:
  function modalwindow(modalCOnfirmation)
  {

      $('#myModal').modal();
       return false;
  }

      

+3


source to share


1 answer


To submit a modal inside a form, you must remove onSubmit

and use the onClick

event on the button

<g:form url="[resource: holidaysInstance, action:'delete']" id="formId" method="DELETE">
     ......
     Form elements will come here
     ......
     <input type="button" class="btn bg-danger button_delete deleteHoliday" id="${holidaysInstance.id}" onClick="return modalwindow(${holidaysInstance.id},'formId')" value="Delete"/>
</g:form>

      

Be sure to pass the object id (holidayInstance.id) and form id (formId) in the onClick method as shown above.



Then, in JS, you need to do the following -

function modalwindow(modalConfirmation,formid)
{
    $('#myModal').modal();
    $('#modalYesButton').click(function () {
       $('#'+formid).submit();
       return true;   
    });
    return false;
}

      

This way it will submit your form using JS through your modal.

+3


source







All Articles