Passing a js variable value in an input type hidden and then retrieve it with php

Question

I would like to count number of submitted form by user with javascript and then put the number of submitted form in a value attribute of an input type hidden and then retrieve that value with PHP (with the name attribute of the input hidden)

Here is a simple code I have tried, but it didn't work :

form.html

<form method="post" action="submit.php">
<input type="text" name="name" placeholder="name"/>
<input type="text" name="firstname" placeholder="firstname"/>
<input type="hidden" name="nb_submit" value="" id="nb"/>
<input type="submit" value="OK" onclick="count_nb_submit()"/>
</form>

after the html form ended, I have put the javascript code:

<script type="text/javascript">
var nb=0;
function count_nb_submit()
{
nb ++;
return nb;
document.getElementById('nb').value=nb;
}
</script>

submit.php

<?php
echo $_POST["nb_submit"] ;
?>

Answer 1

In your script you're return ing before you've finished your function.

You should only use return when you want to stop the function and return a result. Anything after return will not be read.

This is what your code should look like:

<script type="text/javascript">
  var nb=0;
  function count_nb_submit() {
    nb++;
    document.getElementById('nb').value=nb;
    return nb;
  }
</script>

Answer 2

You are using return before setting the value to field, remove the return hope it will work.The function should be -

function count_nb_submit()
{
    // calculate values
    document.getElementById('nb').value= //the value you want to assign;
}

Answer 3

JS CODE :

<script type="text/javascript">
            var nb = 0;
            function count_nb_submit() {
                nb++;
                var myform = document.getElementById('test');
                document.getElementById("nb").value = nb;
                myform.submit();
            }
        </script>

Form CODE :

<form method="post" name="test" action="submit.php"  id="test" target="_blank">
            <input type="text" name="name" placeholder="name"/>
            <input type="text" name="firstname" placeholder="firstname" onblur="count_nb_submit();"/>
            <input type="hidden" name="nb_submit" value="0" id="nb"/>
            <input type="button" value="OK" onclick="count_nb_submit();" />
        </form>

Answer 4

<script type="text/javascript">
var nb = 0;
function count_nb_submit()
{
nb++;
var myform = document.getElementById('test');
document.getElementById("nb").value = nb;
myform.submit();
}
</script>

<form method="post" name="test" action="submit.php" id="test" target="_blank">
<input type="text" name="name" placeholder="name"/>
<input type="text" name="firstname" placeholder="firstname" />
<input type="hidden" name="nb_submit" value="0" id="nb"/>
<input type="button" value="OK" onclick="count_nb_submit();" />
</form>