JQuery Post-Request question - FF doesn't get the result of the referenced php page

Question

Dear community,

I just want to have my question posted here but just from the beginning: For a personal web project I use PHP + JQuery.

Now I got stuck when I try to use the ajax posting method to send data to another php-page. I planned to have some navigational elements like next + previous on the bottom of the page by saving the user input / user given data. The code looks as follows:

<div id="bottom_nav">
    <div id="prev" class="flt_l"><a href="?&step=<?= $pages[$step-1] ?>">next</a></div>
    <div id="next" class="flt_r"><a href="?&step=<?= $pages[$step+1] ?>">previous</a></div>
</div>

The functionality of the page works fine. Lateron, I use the following code to sent data over via POST:

$("#bottom_nav a").click( function() {
    alert("POST-Link: Parameter=" + $("#Parameter").val());
    $.ajax( {
        type:"post",
        url:"saveParameter.php",
        data:"Parameter=" + $("#Parameter").val(),
        success: function(result) {
            alert(result);
            //$("#test").text(result);
        }
    });
});

The request itself work perfectly on IE, but on FF I'm not able to get back any result. within the PHP page, there just written:

<? echo $_POST['Parameter']; ?>

As IE returns the correct value, FF just provide an empty message box. I assumed that the behaviour on the -Link is different. While IE seems to handle the click event after the JS-Code execution, FF will interpret it before.

My question was whether you has a solution on this regarding restructuring the code itself or using another method to reach the intened behaviour.

Thanks for your assistance and recommendations,
Olli

Answer 1

Try:

$("#bottom_nav a").click( function() {
  alert("POST-Link: Parameter=" + $("#Parameter").val());
  $.ajax( {
    type: "POST",
    url: "saveParameter.php",
    data: {
      Parameter: $("#Parameter").val()
    },
    success: function(result) {
      alert(result);
      //$("#test").text(result);
    }
  });
});