Calling JavaScript function after PHP Submit

Question

I'm trying to figure out why this function isn't being called after the form is submitted. The "checkForm()" JS function works fine when the form is submitted, but I can't seem to get the checkDates() function working. I tried moving it above the PHP code and no alert message showed up. Any help is greatly appreciated, thank you!

Here's the pseudo code version of my file:

<?php

if(isset($_POST['next'])){
    // Some PHP code

    echo "<script> checkDates(); </script>";
}

?>

<form name="form1" id="form1" method="post" action="<?php print $thispage;?>" onsubmit="return checkForm()">

// Some HTML code

</form>

<script>
var isDateTimeValid = true;

function checkDates() {
    alert("Hello");
    isDateTimeValid = false;
}

function checkForm () {

    if (isDateTimeValid == true) {
        return true;
    }
    else {
        return false;
    }
}

</script>

Are you sure the echo "<script> checkDates(); </script>" is executing? Can you see the <script> checkDates(); </script> part in your HTML source? — Tjaart van der Walt
– Tjaart van der Walt, Commented Dec 1, 2015 at 6:59
You'll need to put all that after your function definition as well, sense the function must be defined before you call it — Phroggyy
– Phroggyy, Commented Dec 1, 2015 at 7:04
@TjaartvanderWalt I do not see the "<script> checkDates(); </script>" part in the HTML source, so I don't think it's executing, but not sure why? — R. Kelly
– R. Kelly, Commented Dec 1, 2015 at 7:04
@Phroggyy So, basically put the PHP part under the <script> tags? — R. Kelly
– R. Kelly, Commented Dec 1, 2015 at 7:06
@R.Kelly yep. Although if it's not executing, your issue is a different one. Namely you having the wrong name, next, for the submitted field — Phroggyy
– Phroggyy, Commented Dec 1, 2015 at 7:07

Gaurav Jhaloya · Accepted Answer · 2015-12-01 07:25:58Z

7

try this it will work.

here your php code must be last in your file then it will work. otherwise not.

     <form name="form1" id="form1" method="post" action="#" onsubmit="return  checkForm()">

     // Some HTML code
     <input type="hidden" name="next" value="sd">
     <input type="submit">

     </form>

     <script>
      var isDateTimeValid = true;

       function checkDates() {
       alert("Hello");
       isDateTimeValid = false;
      }

     console.log(isDateTimeValid);
     function checkForm () {

     if (isDateTimeValid == true) {
        return true;
     }
     else {
        return false;
       }
     }

   </script>
   <?php

    if(isset($_POST['next'])){
      echo "<script> checkDates(); </script>";
     } 
     ?>

edited Dec 1, 2015 at 7:25

answered Dec 1, 2015 at 7:22

Gaurav Jhaloya

968 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

PKirby Over a year ago

Could you please update your answer with a brief explanation as to what you have changed in order for it to work?

Gaurav Jhaloya Over a year ago

when you submit the form the page will refresh so the php code will read the code from top to bottom so it will call JavaScript function which is declare after calling the function so the calling of the function must be in the last. declaration of function must before the calling.

R. Kelly Over a year ago

This worked, thanks! I believe I need to implement @Swapnil Bhikule's part now to prevent the headers from being sent to the next page. Not sure who is down voting everyone, but I upvoted all. Thanks again!

Swapnil Bhikule · Accepted Answer · 2015-12-01 07:06:15Z

3

I think you should first do this in your javascript function

<form method="post" action="" id="form">
    <!-- some html code -->
</form>

<script>
   // your all code

   $("#form").submit(function(e) {
      e.preventDefault();
      if (isDateTimeValid == true) {
        $.post(
           // post logic with proper url
        );
      }
      else {
        // return some error message
      }
  });
</script>

answered Dec 1, 2015 at 7:06

Swapnil Bhikule

6062 gold badges8 silver badges25 bronze badges

Comments

dev101 · Accepted Answer · 2015-12-01 07:07:59Z

0

try putting the javascript at the top. since you are calling the function which might have not been defined yet in the DOM

answered Dec 1, 2015 at 7:07

dev101

314 bronze badges

Comments

Ahsan Zahid Chowdhury · Accepted Answer · 2015-12-01 07:47:25Z

the problem was your variable and function scoping all the identifiers must be declared. If you run your code with "browser console output" opened, you will see an "Uncaught ReferenceError: checkDates is not defined" after your form submit. If you put the php code after the javascript function deceleration it will work.

<form name="form1" id="form1" method="post" action="#" onsubmit="return checkForm()">

// Some HTML code
    <input type="submit" name="next">

</form>

<script>
var isDateTimeValid = true;

function checkDates() {
    alert("Hello");
    isDateTimeValid = false;
}

console.log(isDateTimeValid);

function checkForm () {
    console.log(isDateTimeValid);
    if (isDateTimeValid == true) {
        return true;
    }
    else {
        return false;
    }
}

</script>

<?php

if(isset($_POST['next'])){
    // Some PHP code

    echo "<script> checkDates(); </script>";
}

?>

see the browser console output.

Collectives™ on Stack Overflow

Calling JavaScript function after PHP Submit

4 Answers 4

3 Comments

Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

3 Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related