Grails Ajax jquery가 작동하지 않습니다.

Question

jquery Ajax 양식을 내 grails 애플리케이션에 제출하려고합니다. 하지만 db에 결과를 저장할 수 없습니다. 사용자가 텍스트 필드를 추가하거나 삭제할 수있는 동적 양식 필드를 사용하고 있습니다.

<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 your own form!</legend> 
    </fieldset> <input type="submit" value="send" name="submit" /> 
</form> 

<input type="button" value="Add a field" class="add" id="add" /> 

<p id="result"></p> 

그래서 jquery는 "필드 추가"버튼을 클릭하여 텍스트 필드 수를 추가합니다.

이제 jquery Ajax 호출을 사용하여 양식을 제출하려고합니다. 이처럼 ..

<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 Successfully !!"); 
         $('#result').html(data); 
         return false; 
        } 
      }) 

      }); 
    }); 
</script> 

여기 내 컨트롤러 -

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() 

     } 
    } 
    } 

하지만 내 양식이 제출 단추에 클릭 한 후 제출할 수 없습니다.

Answer 1

내가 당신의 코드를 복사하고이 내가 행동에있어 PARAMS입니다 그것을

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

을 테스트, 여기에 데이터 name1=a 전용입니다. 세 항목을 추가했습니다. , 많은 감사를

하고 다음과 같은 오류

No such property: name for class: java.lang.String. Stacktrace follows: Message: No such property: name for class: java.lang.String 

그래서 나는 그것이

<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 Successfully !!"); 
        $('#result').html(data); 
        return false; 
       } 
      }) 
      return false; 
     }); 
    }); 
</script> 

<form action="#" id="input_form"> 
    <fieldset id="buildyourform"> 
     <legend>Build your own form!</legend> 
    </fieldset> <input type="submit" value="send" id="asdasd" name="submit" /> 
</form> 

<input type="button" value="Add a field" class="add" id="add" /> 

<p id="result"></p> 

를 작동하도록 코드를 변경있어 이것은

def saveparams() { 
    def paramToAddList = params.list('name') 
    def paramToAddList1 = params.list('email') 

    println "----------------1----${paramToAddList}" 
    println "----------------11----${paramToAddList1}" 

    if (paramToAddList) { 
     for (int i = 0; i < paramToAddList.size(); i++) { 
      println "-----------------------${paramToAddList[i]}---${paramToAddList1[i]}---" 
     } 
    } 
    render params 
}