javascript - How to let the AJAX function handle the submit form -

i creating simple search form

<form id="myform" method="post">     <table>         <tr>             <td><input type="text" name="search" placeholder="search accounts" /></td>             <td><button type="submit">search</button></td>         </tr>            </table>     <br/> </form> 

i don't want form go page. why there no action. ajax function handle that. not working.

i have tried doing javascript,

$('#myform').click(function(){     $.ajax({             url: root_url + 'account/send',             type: "post",             datatype: "text"         }).done(function(data) {             $('#accounts-container').html(data);     }); }); 

when try implement this, directed me home page.

edit

update: .submit , preventdefault works. problem data. go? need data(name="search") textbox controller.

in controller collect data,

list<users> list = accountservice.getuserlist(search); 

if form action, form submitted along data.

there 3 ways prevent change of page little changes in code:

1) change button

<button type="button">submit</button> 

to prevent form submitting form, , triggering ajax function handles submission;

2) change "trigger" of jquery function

$('#myform').submit(function(){ 

so fire jquery on submit , default behavior prevent action redirect happening;

3) add a

event.preventdefault(); 

or

return false; 

immediately before closing jour ajax function.

for concerns collecting yor data, have pass value of input ajax function (assign id="searchinput" search text input):

url: root_url + 'account/send', data: {yourvarname:$("#searchinput").val()}, type: "post",  <input type="text" name="search" id="searchinput" placeholder="search accounts" />