Question

我有多个具有相同名称的选择框。现在，当我从第一个选择框中选择值时，它将提交该值并更新数据库。当我在另一个选择框中选择和项目时，它从第一个框中提交值。我觉得javascript不对。知道什么是错的吗？

继承人我的HTML：

<video width="320" height="240" controls>
  <source src="video.aspx" type="video/mp4">
  Your browser does not support the video tag.
</video>

jquery的：

<?php foreach ($result as $row): ?>
<select class="form-control" name="category[]" required>
    <option value="" disabled selected>Select The Category </option>
    <option value="station">Station</option>
    <option value="equipment">Tools/Equipment</option>
    <option value="supplies">Supplies</option>
</select>
<input id="taskID" value="<?php echo $row['id']; ?>" hidden></input>
<?php endforeach; ?>

addressBook.php

$(document).on('change', 'select[name="category[]"]', function(event){
  $('select[name="category[]"]').each(function(){
          var formData = {
              'task': $('select[name="category[]"]').val(),
              'name': $('input[name="taskID[]"]').val(),
          };
          $.ajax({
                  type: 'POST',
                  url: 'php/addressBook.php',
                  data: formData,
                  dataType: 'html',
                  encode: true
              })
              .done(function(msg) {
                  $(".alert").html(msg);
              })  
              .fail(function(data) {
                  console.log(data);
              })
          event.preventDefault();
      });
  });

Answer 1

将类属性更改为：class="form-control categorySelect"

$('.categorySelect').change(function(event){
      for(selectInstance of $('.categorySelect')){
          var formData = {
          'task': $(selectInstance).val(),
          'name': $(selectInstance).next().val()
          };


          $.ajax({
              type: 'POST',
              url: 'php/addressBook.php',
              data: formData,
              dataType: 'html',
              encode: true
          })
          .done(function(msg) {
              $(".alert").html(msg);
          })  
          .fail(function(data) {
              console.log(data);
          })
          event.preventDefault();
      }

});

多个选项框同名jquery ajax

1 个答案: