Почему мои данные массива jQuery Ajax json повторяются?

#javascript #php #jquery #json #ajax

#javascript #php #jquery #json #ajax

Вопрос:

Не уверен, почему это происходит, может быть, я помещаю коды друг в друга — или, может быть, совершенно другая проблема. Ищу опыт в этой ситуации. Я пытаюсь использовать базовый пример, в котором данные select заполняются из базы данных:

       <div class="col-md-4 mb-3">
        <label for="producer">Select Producers</label>
        <?php if ($data): ?>
        <select class="custom-select d-block w-100" name="producer[]" id="producer" required="" size="5" multiple>
            <?php foreach($data as $row): ?>
                <option value=<?php echo $row['Id'] ?> ><?= $row['producer_name'] ?></option>
            <?php endforeach ?>
        </select>
        <?php else: ?>
            No data found
        <?php endif ?>
        <button class="btn btn-danger btn-sm" type="submit" id="del_producer">Delete</button>
        <div id="asd"></div>
      </div>
  

Есть кнопка, которая отправит несколько выбранных данных на другую страницу php через ajax. Вот код.

 $('#producer').on('click', function(event){
var prodId=' ';
prodId = $(this).val();
var jsonString = JSON.stringify(prodId);
document.getElementById("asd").innerHTML = jsonString;
if (prodId!=""){
  $("#del_producer").click(function(){
    $("#del_producer").attr("disabled", "disabled");
    $.ajax({
            url: "delete.php",
            type: "POST",
            data: {data : jsonString},
            cache: false,
            success: function(result){
                $("#del_producer").removeAttr("disabled");
                prodId = '';
                alert(result);
                console.log(result);
            }
        });
  });
}
    else{
        alert('Please select producer to delete!');
    }
});
  

#asd просто проверяет правильность выбранных значений перед отправкой. И да, это правильно. Теперь мой php-файл выглядит так:

     $data = json_decode(stripslashes($_POST['data']));
    $array = implode(',', $data);
    echo $array;
  

Да, всего три строки, чтобы получить возврат того, что я отправил.
Теперь к проблеме: я отправляю 3 значения идентификатора [2,3,5], они также отображаются в #asd. Теперь, когда я нажимаю кнопку, я получаю ответ [2] , [2,3] , [2,3,5] — три ответа. Это должно быть то, чего мне не хватает. Может кто-нибудь, пожалуйста, указать на это. Мне нужно, чтобы это было [2,3,5], когда я отправляю.

Ответ №1:

Судя по вашему коду jQuery, я предполагаю, что этот код:

$("#del_producer").click(function(){

… может накапливаться несколько прослушивателей кликов del_producer . Вам нужно сделать так, чтобы последняя добавляемая вами функция прослушивания была единственным прослушивателем щелчков.

То же самое может быть верно для $('#producer').on('click', function(event){ , но мне нужно было бы увидеть больше контекста кода, чтобы узнать, может ли там существовать такая же проблема. Важно помнить, что всякий раз, когда вы выполняете .on('some-event', my_function... than, он не заменяет какие-либо существующие функции прослушивателя для этого типа события, он просто добавляет новые.

Комментарии:

1. Я думаю, я понимаю, что вы пытаетесь сказать. Но я не уверен, как поместить оба клика в одну функцию. Первый щелчок по «#producer» при сборе идентификаторов. и при нажатии на кнопку он должен отправить идентификаторы на следующую страницу.