Forum Moderators: open
I'm running a simple ajax script to submit a form.
When submit button is clicked, loader.gif is loaded.
When php is executed, the result is supposed to show on the same page.
But when i run the code, something seems wrong with the #something wrong section below.
The ajax request doesn't work.
Can anyone please take a look on it?
A million and billion thank!
<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(function() {
//trigger ajax on submit
$('#phpForm').submit( function(){
//show the loading bar
$('.loader').append($('.bar'));
$('.bar').css({display:'block'});
// ***********[something wrong] send the ajax request***********
$.post('go.php',{name:$('#name').val()},
//return the data
function(data){
//hide the graphic
$('.bar').css({display:'none'});
$('.loader').append(data);
});
//stay on the page
return false;
});
});
</script>
</head>
<body>
<form id="phpForm" method="post" action="go.php">
<input id="name" name="search" value="testing" />
<input class="submit" type="submit" value="submit"/>
</form>
<br><br>
<div class="loader"></div>
<div class="bar"></div>
</body>
</html>
First, are there any error messages? Have you tried running the page in Firefox with Firebug installed?
If it fails silently, I would start changing the code to see what may be affecting it. The first thing I'd do is hardcode a value into the parameters object:
{'name' : 'test'}
After that, I'd put in an alert to test if the function is returning anything at all:
function(data){
alert(data);
Hopefully one of those changes can illuminate what's wrong with the script. Post back with what you find. :)
I figured out the problem now. it's basically a syntax error.
Now I send my data in this way.
$.post("go.php", { name: $('#name').val() },
And when the data is returned, the data is shown in this way:
function(data){
process(data);
});
The documentation on this : [docs.jquery.com...]
whoisgregg you're so nice!