обновить спецификацию c выбрать пары onchange

Question

У меня есть форма, которая содержит список продуктов, например. Описание продукта 1, название категории, название подкатегории Описание продукта 2, название категории, название подкатегории Описание продукта 3, название категории, название подкатегории и т. Д. c

HTML сниппит формы:

<tr>
<td>Product 1</td>
<td><select name="CategoryID[]"> Options here </select></td>
<td><select name="SubCategoryID[]"> options here </select></td>
</tr>
<tr>
<td>Product 2</td>
<td><select name="CategoryID[]"> Options here </select></td>
<td><select name="SubCategoryID[]"> options here </select></td>
</tr>
<tr>
<td>Product 3</td>
<td><select name="CategoryID[]"> Options here </select></td>
<td><select name="SubCategoryID[]"> options here </select></td>
</tr>

Приведенный ниже скрипт JQuery следит за изменением выбора CategoryID, а onChange использует скрипт PHP для извлечения соответствующих подкатегорий из БД и заполнения выбора подкатегории

Ниже Сценарий js отлично работает в других сценариях, где есть только один элемент, я думаю, это потому, что выбор форм CategoryID и SubCategoryID - это массивы. Мне нужно js, чтобы обновить каждый соответствующий выбор SubCategoryID с правильным списком подкатегорий, которые я до сих пор совершенно новый для js / jquery и был бы признателен за любую помощь, чтобы код работал правильно.

$(document).ready(function() { $('select[name="CategoryID"]').change(function() { var selectedCategoryID = $('select[name="CategoryID"] option:selected').val(); var selectedSubCategoryID = $('select[name="SubCategoryID"] option:selected').val(); $.ajax({
method: "POST", url: '/../_JQuery/GetSubCategory.script.php', data: { CategoryID : selectedCategoryID, SubCategoryID : selectedSubCategoryID }, cache: false }).done(function(data) { $("select[name=SubCategoryID]").html(data); }) }) })