Submiting Ajax form to php - the respone is full page
Hi!
I have problem with my simple form using jquery mobile.
My script works normally on classic website, but it is not working on jquery mobile.
I tried several tutorials, but still the same :( the paramteres of posting form in Firebug are OK,
but the respone back from PHP is not the right and in the respone tab i can see HTML of the whole page.
Sample code HTML:
- <form id="form" method="post">
<fieldset>
<legend>ADD TOPIC</legend>
<p><label for="name_post">BRANCH</label><br />
<input id="query_post" style="background: white;" type="text" name="query_post" /></p>
<p><input id="submit" type="submit" value="Submit" /></p>
</fieldset>
</form>
<div id="message_post"></div>
Sample Javasctip (jquery):
- <script type="text/javascript">
- jQuery('#form').submit(function(event){
event.preventDefault();
var query = jQuery('#query_post').val();
jQuery('#message_post').text('LOADING...');
jQuery.post("ajax.phtml", { query_post: query },
function(data) {
jQuery('#message_post').text("Data Loaded: " + data);
});
return false;
});
- </script>
Sample PHP:
- echo "my posted query is: ".$_POST['query_post'];
On Normal webpage i can fill in the text input and after that it will write me to the page "my posted quers is:"
and the value..
In jQuery mobile it doesnt work. So I tried to add the action="ajax.phtml" atribute to the form, but nothing.
Thanks for ideas!
P.S. Data-Ajax is true due to page tranistions.