i’m using zend framework (php) , i’m trying submit using ajax/jquery.
here’s .phtml:
<form id="find"> <input type="text" name="name"> <input type="submit" id="submit" value="submit"> </form> here’s ajax/jquery part:
$(document).ready(function() { $("#submit").click(function(){ $.ajax({ type:'post', url: "<?php echo site_url;?>training/test", data:$('#find').val(), success: function(response) { alert (response); } }); }); }); here, “training” controller , “test” action inside controller. action has 1 line of code echo “hello”. after user types number in box , clicks on “submit”, control has go controller displaying “hello” on success. however, nothing happens when click on it. please me. in advance.
**edit: noted that, in html, didn't give id attribute "find" field. therefore $('#find').val() give error, "cannot find method val() of undefined. add id=find tag , should work.
** other edit: sorry confusion. form has id=find want send server (i believe), value of fields. give id=name input use:
var data = {find: $('#name').val()}; you should start using console see if event triggered. like:
<script> $(document).ready(function() { $("#submit").click(function(e){ e.preventdefault ? e.preventdefault() : e.returnvalue = false; //this prevent regular submit console.log('hello'); }); }); </script> (you use fire bug or chrome dev tools, right) ? if not, @ end of post. if can see hello in console, you're on right path. try set url in variable , try check in console:
<script> var url = "<?php echo site_url;?>training/test"; $(document).ready(function() { $("#submit").click(function(e){ e.preventdefault ? e.preventdefault() : e.returnvalue = false; //this prevent regular submit console.log(url); }); }); </script> then should see url in console, meaning you're still doing good.
if works, try set data , check output in same way:
<script> var url = "<?php echo site_url;?>training/test"; var data = { find: $('#find').val() }; $(document).ready(function() { $("#submit").click(function(e){ e.preventdefault ? e.preventdefault() : e.returnvalue = false; //this prevent regular submit console.log(data); }); }); </script> hoping still works (you saw data), try actual full code , see if have error or something. also, sure include error function ajax call have response if went wrong on server.
<script> var url = "<?php echo site_url;?>training/test"; $(document).ready(function() { $("#submit").click(function(e){ e.preventdefault ? e.preventdefault() : e.returnvalue = false; //this prevent regular submit var url = "<?php echo site_url;?>training/test"; var data = { find: $('#find').val() }; $.ajax({ type:'post', url: url, data: data, success: function(response) { alert (response); }, error: function(resp) { alert(resp.responsetext); } }); }); }); </script> some tools out:
if using firefox, use firebug debugging: https://addons.mozilla.org/fr/firefox/addon/firebug/
if using chrome (my personal favorite), learn bit more chrome developer tools: https://developers.google.com/chrome-developer-tools/?hl=fr
if using ie, please switch else development purposes, try in ie make sure code compatible (most won't easier find out why doesn't work afterwards).
as line e.preventdefault......, post more details: https://stackoverflow.com/a/15913969/1483513
hope helps !
Comments
Post a Comment