javascript - Grails ajax jquery is not working -

i trying jquery ajax form submit in grails application. not saving result db. using dynamic form fields user can add or delete number of textfields.

<script>   $(document).ready(function() {   $("#add").click(function() {     var intid = $("#buildyourform div").length + 1;     var fieldwrapper = $("<div class=\"fieldwrapper\" name=\"field" + intid + "\" id=\"field" + intid + "\"/>");     var fname = $("<input type=\"text\" name=\"name" + intid + "\" class=\"fieldname\" id=\"tb"+ intid +"_1\"/>");     var lname = $("<input type=\"text\" name=\"email" + intid + "\" class=\"lastname\" id=\"tb"+ intid +"_2\"/>");     var removebutton = $("<input type=\"button\" class=\"remove\" value=\"-\" />");     removebutton.click(function() {         $(this).parent().remove();     });     fieldwrapper.append(fname);     fieldwrapper.append(lname);     fieldwrapper.append(removebutton);     $("#buildyourform").append(fieldwrapper);  });   });  </script>  <form action="#" id="input_form">    <fieldset id="buildyourform">       <legend>build own form!</legend>    </fieldset> <input type="submit" value="send" name="submit" /> </form>  <input type="button" value="add field" class="add" id="add" />  <p id="result"></p> 

so jquery add number of textfield based on "add field" button onclick function.

now trying submit form using jquery ajax call. ..

<script type="text/javascript">      $(document).ready(function(){          $("#input_form").submit(function(){              var querystring = $(this).serialize();               $.ajax({                     url : "/peeldemo/customer/saveparams",                     data : "data=" + querystring,                     success : function(data) {                         alert("submit !!");                         $('#result').html(data);                         return false;                     }              })               });     }); </script> 

here controller --

    def saveparams() {      def paramtoaddlist = params.data     string[] pramstoadd = paramtoaddlist.split("&")     int addparamssize = pramstoadd.size()     if (addparamssize) {         //list<parameter> paramlisttodelete = new arraylist<parameter>()         for(int i=0;i<addparamssize;i++){             def customer = new customer();             customer.name = pramstoadd[i].name             customer.email = pramstoadd[i].email             customer.save()          }     }     } 

but form not able submit after click on submit button.

i copy code , test it

name3:c, data:name1=a, name2:b, email1:1, email2:2, email3:3, action:saveparams, 

this params got in action, here data name1=a only. have added 3 entries.

and got following error

no such property: name class: java.lang.string. stacktrace follows: message: no such property: name class: java.lang.string 

so change code make work

<script>     $(document).ready(function() {         $("#add").click(function() {             var intid = $("#buildyourform div").length;             var fieldwrapper = $("<div class=\"fieldwrapper\" name=\"field" + intid + "\" id=\"field" + intid + "\"/>");             var fname = $("<input type=\"text\" name=\"name\" class=\"fieldname\" id=\"tb"+ intid +"_1\"/>");             var lname = $("<input type=\"text\" name=\"email\" class=\"lastname\" id=\"tb"+ intid +"_2\"/>");             var removebutton = $("<input type=\"button\" class=\"remove\" value=\"-\" />");             removebutton.click(function() {                 $(this).parent().remove();             });             fieldwrapper.append(fname);             fieldwrapper.append(lname);             fieldwrapper.append(removebutton);             $("#buildyourform").append(fieldwrapper);          });      });  </script> <script type="text/javascript">     $(document).ready(function(){         $("#input_form").submit(function(){             var querystring = $("#input_form").serialize();              $.ajax({                 url : "/admin/saveparams",                 data : querystring,                 success : function(data) {                     alert("submit !!");                     $('#result').html(data);                     return false;                 }             })             return false;         });     }); </script>  <form action="#" id="input_form">     <fieldset id="buildyourform">         <legend>build own form!</legend>     </fieldset> <input type="submit" value="send" id="asdasd" name="submit" /> </form>  <input type="button" value="add field" class="add" id="add" />  <p id="result"></p> 

and action

def saveparams() {     def paramtoaddlist = params.list('name')     def paramtoaddlist1 = params.list('email')      println "----------------1----${paramtoaddlist}"     println "----------------11----${paramtoaddlist1}"      if (paramtoaddlist) {         (int = 0; < paramtoaddlist.size(); i++) {             println "-----------------------${paramtoaddlist[i]}---${paramtoaddlist1[i]}---"         }     }     render params }