Reputation: 516
I have searched around but I can't find what is going wrong with my script. I am expecting to see the content posted both to the MySQL database and into my div
.PostedList
, however when I submit I get nothing, the page content does not change at all (the callback does not seem to be executed).
$(function () {
$(".button").click(function () {
var one = $("#one").val();
var two = $("#two").val();
var three = $("#three").val();
var content = 'one' + 'two' + 'three';
if (content == '') {
alert("Fields Missing");
} else {
$.ajax({
type: "POST",
url: "insert.php",
data: content,
cache: false,
success: function (html) {
$(content).hide().prependTo('.PostedList').fadeIn("fast");
document.getElementById('one', 'two', 'three').value = '';
document.getElementById('name', 'two', 'three').focus();
}
});
}
return false;
});
});
<form method="post">
<input type="text" id="one"><br />
<textarea type="text" id="two"/></textarea><br />
<input type="radio" id="three" value="white" />
<input type="radio" id="three" value="black" />
<p> <input class="button" type="submit" value="Post" /></p>
</form>
Upvotes: 0
Views: 49
Reputation: 5399
document.getElementById
only takes one ID value, not several like a jQuery selector
Swap
document.getElementById('one', 'two', 'three').value = '';
document.getElementById('name', 'two', 'three').focus();
for
$('#one', '#two', '#three').val('');
$('#choose_one_id').focus(); // Only one field can have focus at a time!
Addtionally, You probably want to change
var content = 'one' + 'two' + 'three';
to
var content = one + two + three;
Upvotes: 2