Sending Input from a Form via Ajax Request

Question

After following the example and answers by the following threads

jQuery AJAX submit form

submitting a form via AJAX

I have built a similar test form to get to learn the ajax request on submit. Your guess was right, it doesn't work for me (no alert popping up).

My testajax.php with the form:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
<script src="../test.js"></script>

<form name="feedback" id="idForm" action="(myurl)/testajax.php" method="post">

<input id="name" type="text">

<input type="submit" name="feedbacksent" value="Send" />
</p>
</form>

My test.js:

// this is the id of the form
$("#idForm").submit(function(e) {

var url = "(myurl)/testajaxinput.php"; // the script where you handle the form input.

e.preventDefault(); // avoid to execute the actual submit of the form.

alert("bla"); // does not work either

$.ajax({
       type: "POST",
       url: url,
       data: $("#idForm").serialize(), // serializes the form's elements.
       success: function(data)
       {
           alert(data); // show response from the php script.
       }
     });

});

My testajaxinput.php that should handle the input:

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

echo "<h1>".WORKS."</h1>";  

}

Answer 1

Try this :

if (isset($_POST['feedbacksent'])){
    echo "<h1>".WORKS."</h1>";  
    return true;
}

Then try your alert and also check have you got any error in console.