从包含两个下拉列表的表行中，获取选定的值以及更改的下拉列表
我正在尝试更新表中的两个级联下拉，有很多答案在SO上有下拉，但我无法找到有关dynamically added rows的Table内cascading updates帮助。
鉴于它们有很多行，它们都有不同的Id filter #Id不起作用。 那么， 如何识别Dropdown触发更改的哪些行并在同一行的下一个col中更新另一个Dropdown / cell ？
表行单元格中有2个DropDownList （选择框）。 为了简化这一点，第一个是Country – >第二个是state 。 因此，期望用户选择国家，然后选择州。
我的伪算法：
- 找到哪一个被解雇，哪一行（ 不确定是否需要，我应该在哪里接线 ）
- 然后触发ajax调用…以获取基于国家/地区的值
- 使用同一表格行中的值更新第二个下拉列表。
- 案例1更改国家/地区然后更改状态。
- 情况2只需更改State， 但首先在同一行的第一个下拉列表中获取Country值 。
我知道如何在常规页面中获取更改和值，但如何获取这些更改并更新相邻的下拉列表。
$(document).on('change', 'select', function(){ var data = $(this).val(); alert(data); });
编辑，斯蒂芬请求显示HTML
//DropDown 1 (Imagine Country) Plumbing Modeling //DropDown 2 (Imagine State)
示例图像以便澄清 
您需要同时提供元素类名称并使用相对选择器来选择同一行中的关联元素。
假设你的HTML是
// give this an id attribute
然后你的脚本将是
$('#table').on('change', '.country', function() { var selectedValue = $(this).val(); var row = $(this).closest('tr'); // get the row var stateSelect = row.find('.state'); // get the other select in the same row // make you ajax call passing the selectedValue to your controller // in the success callback, update the options of stateSelect $.ajax({ url: ... data { id: selectedValue }, .... success: function(data) { stateSelect.empty(); $.each(data, function(item, index) { stateSelect.append($('').val(iem.ID).text(item.Name)); } } }); }
有关填充级联下拉列表的代码的详细信息，请参阅在mvc中加载2下拉列表的更好方法 （考虑根据第二个代码示例缓存选项以避免重复的ajax调用）
假设您无法按类或任何方式识别dropdwns。 假设每次更改下拉列表中的值时，您都希望更新同一行上的其他下拉列表。 假设每行只有两个下拉列表：
$('table').on('change', 'select', function() { var $current_dropdown = $(this), $other_dropdown = $(this).closest('tr').find('select').not(this); /// perform any task you need with current and other dropdown });