0
我有克隆元素的代码,但如何根据在第一个下拉列表中选择的结果自动填充第二个元素?使用Jquery动态添加下拉列表并克隆该下拉列表?
这是我发现用于克隆的代码。
<table id="BoxTable">
<tr>
<th>Name</th>
<th>Comparision</th>
<th>Value</th>
<th>Delete</th>
</tr>
<tr id="TemplateRow">
<td>
<select name="BoxName" id="BoxName">
<option selected="selected" value="attr1">attr1</option>
<option value="attr2">attr2</option>
<option value="attr3">attr3</option>
</select>
</td>
<td>
<select name="BoxComparison" id="BoxComparison">
<option selected="selected" value="=">=</option>
<option value=">">></option>
<option value="<"><</option>
<option value="Like">Like</option>
<option value="!=">!=</option>
</select>
</td>
<td>
<input name="BoxVal" type="text" id="BoxVal" />
</td>
<td>
<input id="DeleteBoxRow" type="checkbox" name="DeleteBoxRow" />
</td>
</tr>
<tr>
<td colspan="4">
<input type="submit" name="AddAttr" value="Add Box Attribute" id="AddAttr" />
</td>
</tr>
</table>
现在的jQuery ......
$(function() {
//attach the a function to the click event of the "Add Box Attribute button that
will add a new row
$('#AddAttr').click(function() {
//clone the template row, and all events attached to the row and everything in it
var $newRow = $('#TemplateRow').clone(true);
//strip the IDs from everything to avoid DOM issues
$newRow.find('*').andSelf().removeAttr('id');
//add the cloned row to the table immediately before the last row
$('#BoxTable tr:last').before($newRow);
//to prevent the default behavior of submitting the form
return false;
});
//attach a remove row function to all current and future instances of the
"remove row" check box
$('#DeleteBoxRow').click(function() {
//find the closest parent row and remove it
$(this).closest('tr').remove();
});
//finally, add an initial row by simulating the "Add Box Attribute" click
$('#AddAttr').click();
});
请帮助我..
它不自动填充上改变的值的下拉列表包含下拉列表的列“名称”。 – nikunj2512
您需要做的第一件事是让您的问题更易于理解。我大部分时间都在猜测你真正想达到的目标。如何改写你的问题,并再次阅读你的问题,看看你是否明白你一直在问什么。 –
我明确提到如何根据第一个下拉列表的结果自动填充第二个dropdwon列表。 – nikunj2512