Javascript 发送每行表单的下拉列表值

我有一个表单下拉值和一个有许多行要提交数据的表。 我想做的是在提交每一行的过程中，从下拉列表中获取值。 我的桌子看起来像是我的Drop溺水列表代码

<div class="panel-heading">
   <label for="cat">Select a Category</label>
      <select class="form-control" id='category' name="category" data-live-search="true" style="max-width:40%;" >
         <?=$html?>
      </select>
  </div>

选择一个类别

表行的部分是

<form id="sync-cat" action="controllers/product-add.php" target="_blank">
     <input type="hidden" name="product" value="<?=$product['id']?>">
     <button type="submit" class="btn btn-info btn-md">Sync Products</button>
</form>

他们应该在HTML中共享相同的表单，以便在发布表单时，表单中会显示所有可用信息。不管怎样，你的下拉列表也应该是它自己的形式（如果你不把它们放在相同的形式）才是有效的

如果你想继续下去，因为忽略了上面要考虑的适当的事情，你可以用类似的方法去做。这个解决方案会让事情变得更复杂。我建议采纳上述建议

var form = document.getElementById('sync-cat')

form.addEventListener('submit', function(e) {
  var valueFromDropDown = document.getElementById('category').value;

  // Post the rest of the form
});

按照本文的其余部分完成JavaScript文章