I'm struggling to get a $.ajax call to correctly send some form data to PHP (where it gets recorded to a database and then displayed). I'm stumped because I've $.ajax to do similar tasks before and it's worked great but I must be missing something critical here. I've researched other answers (such as this one) but can't find anything there that suggests my current code would not work. Any insight would be greatly appreciated!
The form looks like this:
<div id="note_add_container">
<form id="note_add" method="POST">
<input type="text" name="title" placeholder="title" />
<input type="text" name="summary" placeholder="summary" />开发者_JAVA技巧
<input type="text" name="details" placeholder="details" />
<button id="submit_note">Add note!</button>
</form>
</div>
<div id="entries">
<!-- AJAX call will populate entries here -->
</div>
Here is the jQuery:
$('#submit_note').click(function () {
var text = $.ajax ({
type: "POST",
url: "note_process.php",
data: $('#note_add').serialize(),
dataType: "json",
async: false,
}).responseText;
$('#entries').html(text);
})
Here is the PHP note_process.php:
include_once "connect.php";
session_start();
$id = $_SESSION['userid'];
$title = $_POST['title'];
$summary = $_POST['summary'];
$details = $_POST['details'];
$query = mysql_query("INSERT INTO notes (id, title, summary, details) VALUES ('$id', '$title','$summary','$details')");
echo $title . $summary . $details;
Try using 'success', instead of making the Ajax request not-async...
$('#submit_note').click(function () {
$.ajax ({
type: "POST",
url: "note_process.php",
data: $('#note_add').serialize(),
success: function(text){
$('#entries').html(text);
}
});
});
If things still aren't working, I'd be weary of whether your url is accurate...
Try using an absolute path to your PHP file instead... such as "/note_process.php" (or wherever the file is located relative to your site root)
This is a guess:
- You have error reporting turned off (bad while in dev phase)
title
column isrequired
in yournotes
table,- (this is a fact) you are using the wrong post parameter in
$title = $_POST['type'];
So:
$title = $_POST['type'];
should generate a warning, but it doesn't,$title
will be blank and your query fails to insert the record and you get a fatal error, but do not see it.
My findings on jsFiddle: the <button>
seems to be submitting the form!? God knows why!? The solution is fairly simple =) Don't use a <button>
Replace the BUTTON tag with an A tag and it works fine.
Jordan Rynard has good point: you sure your URL is valid and correct?
精彩评论