2013-05-17 2 views
0

여러 입력 유형을 가진 검색 양식이 있는데 사용자가 입력을 변경할 때마다 검색 양식에서 값을 가져오고 싶습니다.jquery - 다차원 배열 양식 입력 값 가져 오기

양식이 같다 :

<form id="search"> 
<input type="hidden" name="cat[0][name]" value="cat1"> 
//select type input. 
<select id="cat-0" name="cat[0][id]" > 
<option value="1">1</option> 
<option value="2">2</option> 
<option value="3">3</option> 
<option value="4">4</option> 
<option value="5">5</option> 
</select>  
<input type="hidden" name="cat[1][name]" value="cat2"> 
<select id="cat-1" name="cat[1][id]" > 
<option value="1">1</option> 
<option value="2">2</option> 
<option value="3">3</option> 
<option value="4">4</option> 
<option value="5">5</option> 
</select> 

//checkbox type input 
<input type="hidden" name="cat[2][name]" value="cat3"> 
<label><input id="cat-2" type="checkbox" name="cat[2][id][]" value="1"> 1</label> 
<label><input id="cat-2" type="checkbox" name="cat[2][id][]" value="2"> 2</label> 
<label><input id="cat-2" type="checkbox" name="cat[2][id][]" value="3"> 3</label> 


//radio type input 
<input type="hidden" name="cat[3][name]" value="cat4"> 
<label><input id="cat-3" type="radio" name="cat[3][id]" value="1"> 1</label> 
<label><input id="cat-3" type="radio" name="cat[3][id]" value="2"> 2</label> 
<label><input id="cat-3" type="radio" name="cat[3][id]" value="3"> 3</label> 
</form> 

은 입력 값이 다차원 어레이에 볼 수 있듯이. 사용자가 입력 중 하나를 변경하면 자바 스크립트로 값을 어떻게 얻을 수 있습니까? 내가 원했던 것은 site과 같은 검색 엔진을 만드는 것뿐입니다.

양식이 동적으로 생성되므로 모든 필드에 고정 ID/클래스를 정의 할 수 없습니다.

js 스크립트는 다음과 유사해야합니다.

$('[id^=cat]').live('change', function(e) { 
      passing_data(); 
      return false; 
     }); 

     function passing_data() { 
      var getdata = $(':input[name="cat"]').val();//this i can't get it. 
      alert(getdata); 
      return false; 
     } 

passing_data()는 내가 얻지 못한 부분이며, 검색 기능을 수행하기 위해 아약스에서 사용됩니다.

아이디어가 있으십니까?

+0

단순히'form'를 직렬화하고 ajax''를 통해 서버로 전송하고이 모든 것을 처리 할 수 ​​있습니까? –

+0

합리적인 것 같습니다. 시도해보고 여기에 의견을 남깁니다. 감사 –

답변

1

은 "이"함수에 전달하십시오 : legendinmaking 및 JohnMarkT에 의해 주어진

$('[id^=cat]').live('change', function(e) { 
     passing_data($(this)); // pass object as a jQuery object 
     return false; 
    }); 

    function passing_data($obj) { 
     var getdata = $obj.val(); 
     alert(getdata); 
     return false; 
    } 
0

대답은, 모두가 내 문제를 해결할 수 있습니다. 정말 당신의 답변을 주셔서 감사합니다. 그것은 나를 많이 돕는다.

나를 위해 최종 솔루션은 다음과 같이 두 답변을 결합 할 수 있습니다 :

$('[id^=cat]').live('change', function(e) { 
     passing_data($(this)); // pass object as a jQuery object 
     return false; 
    }); 

    function passing_data($obj) { 
     var getdata = $obj.closest("form").serialize();// i have multiple form,so it should choose the responding form. 
     alert(getdata); 
     return false; 
    } 
관련 문제