单击html表单后使用php提交后弹出

Question

I have a submit button"Certificate copy" when i clicked the button it should show a popup. The below one is my html code.

print "<script src='https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js'></script>";
print "<form action='details.php' name='copy' method='POST' target='_blank'>";


        print "<input type='hidden' name='certificate_name' value='$certificate_name'>";
        print "<input type='hidden' name='certificate_id' value='$certificate_id'>";


        print "<input type='submit' name='certificatecopy' id='certificate' value='Certificate Copy'>";

print "</form>" ;

and my code for popup is

    print "<script> $(document).on('click','#certificate',function(){val = confirm('Do you want to create a new certificate?');
alert(val);
if(val)
{
     alert('proceed '); 
     return true;
}
else
{
   alert('Dont proceed');
   return false;
}
});</script>";

My problem is, when i click the button at first time the popup box doesn't appear. but when the button clicked second time, the popup box is appear. what is the problem. I need the popup when the button clicked first time. please help.

Answer 1

You need to do this in client side on button click event .

Confirm will return the Boolean value true or false . Based on user click.

 $(document).on('click','#certificate',function(){ val = confirm('This will create a new certificate with all properties and links from the original certificate. A certificate user may edit the new certificate properties, but may not delete the certificate. Do you want to create a new certificate?'); alert(val); if(val) { alert('proceed '); return true; } else { alert('Dont proceed'); return false; } }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <form action='details.php' name='copy' method='POST' target='_blank'> <input type='hidden' name='certificate_name' value='$certificate_name'> <input type='hidden' name='certificate_id' value='$certificate_id'> <input type='submit' name='certificatecopy' id="certificate" value='Certificate Copy'> </form> 

Update 1 :

<?php
print "<script src='https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js'></script>";
print "<form action='details.php' name='copy' method='POST' target='_blank'>";


        print "<input type='hidden' name='certificate_name' value='$certificate_name'>";
        print "<input type='hidden' name='certificate_id' value='$certificate_id'>";


        print "<input type='submit' name='certificatecopy' id='certificate' value='Certificate Copy'>";

print "</form>" ;

print "<script> $(document).on('click','#certificate',function(){val = confirm('Do you want to create a new certificate?');
alert(val);
if(val)
{
     alert('proceed '); 
     return true;
}
else
{
   alert('Dont proceed');
   return false;
}
});</script>";

?>

Answer 2

Instead of adding in $_SESSION['pop_up'] just echo it:

if(isset($_POST['certificatecopy'])){

  echo "<script>
            .....................
            .....................
        </script>";

Answer 3

You want to ask for the confirmation Client side before sending a request to the server?

If you use Bootstrap, you can try a little jQuery plugin I made, https://github.com/delboy1978uk/bs-delete-confirm . It doesn't need to be used solely for deletion, it's only named that since it's the most used case.

All you do is add a CSS class to your link:

<a href="/wherever" class="confirm">Do stuff!</a>

And the javascript:

$(document).ready(function(){
  $('.confirm').deleteConfirm();
});

Now when you click the link, the JS intercepts it, launches a bootstrap modal window, and upon confirming, follows your hyperlink.

You can pass options in to the deleteConfirm() method too:

{
  heading: "Please confirm",
  body: "Are you sure you wish to perform this action?",
  ok_text: "Proceed",
  cancel_text: "Back",
  log: false
}

Hope this helps! If you don't use Bootstrap, it's well worth addingto your project! Here's a link to the modal functionality: https://getbootstrap.com/docs/3.3/javascript/#modals