2014-09-28 5 views
0

나는 이와 같은 테이블을 가지고 있습니다.jquery를 사용하여 html 테이블에서 값 가져 오기

<form id="myform"> 
    <table> 
    <tr><th>TEST</th> <th>VALUES</th> <th>UNIT</th> 
    <tr><td>Abc</td><td><input type="text" ></td><td>unit 1</td></tr> 
    <tr><td>DEF</td><td><input type="text" ></td><td>unit 12</td></tr> 
    <tr><td>ASD</td><td><input type="text" ></td><td>unit 321</td></tr> 
    </table> 
     <input type="button" id="btn" value="click" /> 
</form> 

#myform 양식에서 null 값이 아닙니다. jquery를 사용하고 있습니다. 코드는 다음과 같습니다.

$('#btn').click(function(){ 
      var store = []; 
      var i = 0; 
    $('#myform :input[type="text"]').each(function(){ 
     var testVal = $(this).val(); 
     if(testVal != null){ 
     store[i] = testVal; 
     i++; 
      } 
    }); 
}); 

이 코드는 null이 아닌 값을 가져옵니다. 그러나 null이 아닌 입력 필드의 값도 TESTUNIT으로 지정하고 싶습니다.
예 :
두 번째 입력 필드에 값을 입력하면 DEF, value which is providunit 12이됩니다. 유닛이 그 입력 필드의 다음에 있으며 테스트는 이것을 통과합니다.
어떻게 그 제안, PLZ 할 수 있습니다.
Thankx. 다음

+0

* 것이라고

참고 "그러나 나는 또한 null가 아닌 그 입력 필드 테스트 및 UNIT 값을 얻을 싶어요." * - 그래서, 입력 값이 있지만 상응하는 TEST와 UNIT 값이 null이라면, 그 행에 대한 값을 어떻게 얻고 싶습니까? 해당 데이터 구조는 무엇입니까? –

답변

0

넌 JS 오브젝트의 배열을 만들 수

$('#btn').click(function() { 
 
    var store = []; 
 
    $('#myform :input[type="text"]').map(function() { 
 
     var test = $(this).parent().prev().text(); 
 
     var values = $(this).val(); 
 
     var unit = $(this).parent().next().text(); 
 
     if (values) { 
 
      store.push({ 
 
       test: test, 
 
       value: values, 
 
       unit: unit 
 
      }); 
 
     } 
 
    }); 
 
    console.log(JSON.stringify(store)); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<form id="myform"> 
 
    <table> 
 
     <tr> 
 
      <th>TEST</th> 
 
      <th>VALUES</th> 
 
      <th>UNIT</th> 
 
     </tr> 
 
     <tr> 
 
      <td>Abc</td> 
 
      <td> 
 
       <input type="text" /> 
 
      </td> 
 
      <td>unit 1</td> 
 
     </tr> 
 
     <tr> 
 
      <td>DEF</td> 
 
      <td> 
 
       <input type="text" /> 
 
      </td> 
 
      <td>unit 12</td> 
 
     </tr> 
 
     <tr> 
 
      <td>ASD</td> 
 
      <td> 
 
       <input type="text" /> 
 
      </td> 
 
      <td>unit 321</td> 
 
     </tr> 
 
    </table> 
 
    <input type="button" id="btn" value="click" /> 
 
</form>

할 수 루프 store 배열을 예를 들면 store[i].test 같은 값에 액세스. testunit 열이 비어있는 경우, 오브젝트의 값을 대응하는 null이 될

관련 문제