jquery 드롭 다운의 json 데이터가있는 테이블 행 추가

Question

사용자가 추가 행을 추가 할 수있는 테이블이있는 웹 양식이 있습니다. 표의 첫 번째 행은 종속 드롭 다운으로 구성됩니다. 드롭 다운에는 참조 된 파일의 json 데이터가 채워집니다. 다음과 같이 내가 그것을 사용하고 코드는 다음과 같습니다

//the add row function 
$(function(){ 
var newgroup = $('<tr>').addClass('rec-rows'); 
$('#addRow').click(function(e){ 
    e.preventDefault(); 
$('.rec-rows').first().clone().appendTo(newgroup).appendTo('#details');  }); 

}); 

//onChange function 
$(".rec-rows #section").live('change',function(){ 


var sSec =$(this).parent().find('#section').val(); 

$("#divParts").hide(); 
$("#divDesc").hide(); 
$("#divGroup").hide(); 
if(sSec=="select") { 
$("#divCategory").hide(); 
} else { 
$.getJSON("static/site_category.json", function(json) { 
var catJson = json[sSec]; 
var options = "<option value=\"select\">Select Area Type</option>"; 
for(i=0;i<catJson.length;i++) { 
options +="<option value=\""+catJson[i].ky+"\">"+catJson[i].val+"</option>" 
} 

은 이론적으로, 새로운 행이 추가되고 내가 붙여 onchange를 코드는 각각의 추가 행에 대해 작동합니다. 그러나 결과는 전혀 다릅니다. 행이 추가되고 사용자가 새 행에 대한 선택을 할 때 대신, 값이 테이블의 첫 번째 row.The 첫 번째 부분에서 업데이트는 다음과 같습니다

이

<td width="" align="left"> 
<div> 
<select id="section" name="section" style="margin-top:15px;"> 
<option value="select">Select Area</option> 
<option value="a">a</option> 
<option value="b">b</option> 
<option value="c">c</option> 
</select> 
</div> 
</td> 

내가 얻을 수있는 도움을 주셔서 감사합니다 이 코드는 원하는대로 작동합니다. 드롭 다운 선택 항목은 발견 된 행에서만 업데이트되는 간단한 추가 행입니다. 고맙습니다.

Answer 1

여기에 테이블의 시작에 동적으로 행을 추가하는 방법에 대한 내 대답 볼 수 있습니다 :

How can I dynamically generate a table row with it's tds?

그것은 당신을 도움이 될 수 있습니다.

또는 문제가 있습니다. .

변경 $ ("# 섹션 ')을 변경 (

에! 새로운 드롭 다운이 솔루션을 얻었다

Answer 2

를 작동하지 않는 이유

이

$("#section").live('change',... 

될 수 있다고 나는 것을 권고했다 부모와 같은 문맥을 다음과 같이 선언하십시오 :

이제 모든 "행 추가"c 핥기, 행이 추가되고 해당 행과 그 행에 대한 사용자 선택시 드롭 다운이 변경됩니다.