CODEWITHSUNDEEP
phpjavascripthtmlwebforms
TheLettuceMaster
TheLettuceMaster

Reputation: 15734

Grab Value from Javascript popup - use as php post value

First off, if there is a completely better way of doing this? let me know... This way seems kind of "hackish". Here is what I am trying to do: As you see in the below input, I have a text field that I simple want to appear like an <a> link. If the user clicks it, I want JavaScript pop up box to appear with user entering the email. I want them to hit ok, and I send that email value back to the form and the form then submits via a php post.

I do not know how to grab the value from the box and insert it in the form (if possible) so it can submit to php.

Here is the code:

    <form id="frm1" action="login.php" method = "post">
        <input onclick="resetPassword()" type="text" name="email" value="Reset Password" style="cursor: pointer; background:none; text-decoration: underline; border: none;"  />
    </form>


    <script>
        function resetPassword() {
        var x;

        var email=prompt("Enter email to reset password.", "[email protected]");

        if (email!=null)
          {
          document.getElementById("frm1").submit();
          }
        }
   </script>


  <?php 
     if (isset($_POST['email'])) {
         $email = $database -> escape_value(trim($_POST['email']));
        //  reset password    
      }
  ?>

Upvotes: 0

Views: 1026

Answers (3)

Barmar
Barmar

Reputation: 782105

Add an ID to the input field:

<form id="frm1" action="login.php">
    <input id="email" onclick="resetPassword()" type="text" name="email" value="Reset Password" style="cursor: pointer; background:none; text-decoration: underline; border: none;"  />
</form>

    function resetPassword() {

    var email=prompt("Enter email to reset password.", "[email protected]");

    if (email!=null)
      {
      document.getElementById("email").value = email; // Put value into form field
      document.getElementById("frm1").submit();
      }
    }

If you don't want the user to be able to type directly into the form field, you should give it the readonly attribute. onclick prevents them from clicking on it, but they could still get there with Tab.

Upvotes: 1

Konsole
Konsole

Reputation: 3475

Grab the email from promt, paste it to input field and submit the form.

<form id="frm1" action="login.php" method='post'>
    <input id="email" onclick="resetPassword()" type="text" name="email" placeholder="Reset Password" />
</form>

<script type="text/javascript">
  function resetPassword() {    
    var email = prompt("Enter email to reset password.", "[email protected]");

    if (email != null) {
      document.getElementById("email").value = email; 
      document.getElementById("frm1").submit();
    }
  }
</script>

Upvotes: 1

Leprosy
Leprosy

Reputation: 1135

A better aproach would be the use of jQuery and send the info of the text field via AJAX to the script which is expecting the $_POST variable. This way, the <form> element would be unnecessary.

    function resetPassword() {
        var x;
        var email=prompt("Enter email to reset password.", "[email protected]");
        if (email!=null) {
             $.post( url_of_the_script, {email: email}, function() { alert('Email sent'); } );
        }
    }

Upvotes: 1

Related Questions