I have a modal with checkboxes and I am trying to reuse it for 2 buttons that pull the info to 2 different spots on the site.
The problem is from JQuery. Things will submit but if I press Button A
then everything works fine. If I press Button B
after this then Button A
will resubmit and Button B
will submit too. This also happens if you do the buttons in the opposite order.
We have the main page that is a form. This modal pops up a form with button A. You select a policy and then click submit. This adds it to the main form. If you select a policy with button B it adds policy files. Similar but slightly different but still they both use the same modal
A modal pops up from pressing this.
<a href="#" data-mylink="1" role='button' class="btn btn-default" data-toggle='modal' data-target='#policyattach_instructions1'>Button A</a>
<a href="#" data-mylink="2" class="btn btn-default" data-toggle="modal" data-target="#policyattach_instructions1">Button B</a>
Submit button on Modal. It checks if the checkbox is checked with the click of the button and doesn't get in the way of the JQuery.
<input type="button" name="action" class="btn btn-success ajaxifypolicies2" value="Add Policy" onClick="if(radio_checkbox_validate(document.add_policies_form,'one or more Policies & Procedures.')) { return true; } else { return false; }" />
JQuery:
$('#policyattach_instructions1').on('shown.bs.modal', function (e) {
$('#add_policies_display').html("<center style='margin-top: 25px;'>Use the search tools above to find Policies & Procedures.</center>");
var btn = $(e.relatedTarget);
var pnpid = btn.data('mylink');
//alert(pnpid);
if(pnpid==1){
$(".ajaxifypolicies2").click(function(){
alert("test98");
$('[id^="add_policies_checkbox"]').each(function(i, v){
if($(v).prop('checked')){
var data=$(v).val();
//alert(data);
$("#linked_pnp_instructions").append("<div id='pnpID_instruction"+data+"1'><h6><input type=hidden name=pnpID_instructions value=\'"+data+"\' />P&P #'s: "+data+" <a href='#' class='clear_pnp' id='pnpID_instruction"+data+"'>Clear</a></h6></div>");
//$("#policyattach_instructions1").removeData('bs.modal');
}
});/**/
$(".clear_pnp").click(function(){
var ID=this.id;
//alert(ID+"1");
$("#"+ID+"1").remove();
return false;
});
$("#policyattach_instructions1").modal('hide');
});//end ajaxifypolicies/**/
}
else
{
$(".ajaxifypolicies2").click(function(){
alert("test99");
$('[id^="add_policies_checkbox"]').each(function(i, v){
if($(v).prop('checked')){
var data=$(v).val();
//alert(data);
$("#linked_pnp").append("<div id='pnpIDs"+data+"1'><h6><input type=hidden name=pnpIDs value=\'"+data+"\' />P&P #'s: "+data+" <a href=# class=clear_pnp id='pnpIDs"+data+"' >Clear</a></h6></div>");
//$("#policyattach_instructions1").removeData('bs.modal');
// $("#policyattach_instructions1").modal('hide');
}
});/**/
$(".clear_pnp").click(function(){
var ID=this.id;
//alert(ID+"1");
$("#"+ID+"1").remove();
return false;
});
$("#policyattach_instructions1").modal('hide');
});//end ajaxifypolicies/**/
}
return false;/**/
});//end modal
$('#policyattach_instructions1').on('hidden.bs.modal', function (e) {
alert("asfdasf");
$(this).removeData('bs.modal');
});
I also tried this to try and avoid using ajaxifypolicies2 twice:
$(".ajaxifypolicies2").click(function(){
if(pnpid==1){
alert("test98");
$('[id^="add_policies_checkbox"]').each(function(i, v){
if($(v).prop('checked')){
var data=$(v).val();
//alert(data);
$("#linked_pnp_instructions").append("<div id='pnpID_instruction"+data+"1'><h6><input type=hidden name=pnpID_instructions value=\'"+data+"\' />P&P #'s: "+data+" <a href='#' class='clear_pnp' id='pnpID_instruction"+data+"'>Clear</a></h6></div>");
//$("#policyattach_instructions1").removeData('bs.modal');
}
});/**/
}
else
{
alert("test99");
$('[id^="add_policies_checkbox"]').each(function(i, v){
if($(v).prop('checked')){
var data=$(v).val();
//alert(data);
$("#linked_pnp").append("<div id='pnpIDs"+data+"1'><h6><input type=hidden name=pnpIDs value=\'"+data+"\' />P&P #'s: "+data+" <a href=# class=clear_pnp id='pnpIDs"+data+"' >Clear</a></h6></div>");
//$("#policyattach_instructions1").removeData('bs.modal');
// $("#policyattach_instructions1").modal('hide');
}
});/**/
}
$(".clear_pnp").click(function(){
var ID=this.id;
//alert(ID+"1");
$("#"+ID+"1").remove();
return false;
});
$("#policyattach_instructions1").modal('hide');
});//end ajaxifypolicies/**/
return false;/**/
});//end modal
$('#policyattach_instructions1').on('shown.bs.modal', function (e) {
$('#add_policies_display').html("<center style='margin-top: 25px;'>Use the search tools above to find Policies & Procedures.</center>");
// alert("testy");
var btn = $(e.relatedTarget);
var pnpid = btn.data('mylink');
//var pnpid = $(this).data('mylink');
//alert(pnpid);
$(".ajaxifypolicies2").click(function(){
alert(pnpid);
if(pnpid==1){
alert("test98");
pnpid = ("");
$('[id^="add_policies_checkbox"]').each(function(i, v){
if($(v).prop('checked')){
var data=$(v).val();
//alert(data);
$("#linked_pnp_instructions").append("<div id='pnpID_instruction"+data+"1'><h6><input type=hidden name=pnpID_instructions value=\'"+data+"\' />P&P #'s: "+data+" <a href='#' class='clear_pnp' id='pnpID_instruction"+data+"'>Clear</a></h6></div>");
//$("#policyattach_instructions1").removeData('bs.modal');
}
});/**/
}
removed the Else If and made it an if only
if(pnpid==2)
{
alert("test99");
Prevented multiple values from being submitted from previous submits pnpid=("");
pnpid = ("");
$('[id^="add_policies_checkbox"]').each(function(i, v){
if($(v).prop('checked')){
var data=$(v).val();
//alert(data);
$("#linked_pnp").append("<div id='pnpIDs"+data+"1'><h6><input type=hidden name=pnpIDs value=\'"+data+"\' />P&P #'s: "+data+" <a href=# class=clear_pnp id='pnpIDs"+data+"' >Clear</a></h6></div>");
//$("#policyattach_instructions1").removeData('bs.modal');
// $("#policyattach_instructions1").modal('hide');
}
});/**/
}
$(".clear_pnp").click(function(){
var ID=this.id;
//alert(ID+"1");
$("#"+ID+"1").remove();
return false;
});
$("#policyattach_instructions1").modal('hide');
});//end ajaxifypolicies/**/
return false;/**/
});//end modal
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.