Несколько экземпляров jquery и отправка значения в php через ajax - PullRequest
0 голосов
/ 09 мая 2019

У меня проблема с несколькими экземплярами jquery и способом получения данных и отправки их на следующий шаг через ajax.

код jquery:

$(document).ready(function(){

  for (var i = 1; i <= 5; ++i) {

    $('#toggle'+i).change(function(i){
      var mode= $(this).prop('checked');
      var data+i = $('#building_'+i).val();
      // // submit the form 
      // $(#myForm).ajaxSubmit(); 
      // // return false to prevent normal browser submit and page navigation 
      // return false; 
    $.ajax({
      type:'POST',
      dataType:'JSON',
      url:'admin/sites/audio_alarm.php',
      data: { mode: mode, building_id: data+i },
      success:function(data)
      {
        var data=eval(data);
        message=data.message;
        success=data.success;
        $("#heading").html(success);
        $("#body").html(message);
        }
      });
    });
  }
});

тогда у меня естьсписок зданий из базы данных:

<input type="checkbox" name="toggle" id="toggle<?php echo $row["id"];?>" data-toggle="toggle" data-off="Disabled" data-on="Enabled">
<input type="hidden" name = "building_id_<?php echo $row["id"];?>" id="building_id_<?php echo $row["id"];?>" value="<?php echo $row["id"];?>">

на данный момент это не работает.Если я удалю все идентификаторы из последнего кода, он будет работать, но только отправит первый экземпляр (в данном случае идентификатор равен 1).

По сути, это список зданий.Каждый результат имеет тумблер для отключения здания.Как только вы переключаете переключатель, мне нужно отправить идентификатор здания через ajax и обновить базу данных.

Я осмотрелся, но нашел похожую проблему.Кроме того, я новичок в jquery, и на данный момент мне это кажется слишком сложным.

Любая помощь приветствуется.

Спасибо

РЕДАКТИРОВАТЬ:

Просто, если кому-то интересно:

Ответ, помеченный ниже, работает и, как предлагается, я передаю значение в одном элементе (флажок)

<input type="checkbox" class="toggle" name="toggle" data-toggle="toggle" data-off="Disabled" data-on="Enabled" value="<?php echo $row["id"];?>">

1 Ответ

0 голосов
/ 09 мая 2019

Присвойте всем флажкам и скрытым вводам класс, чтобы вы могли выбрать его вместо циклического перебора идентификационных номеров.

Затем используйте функцию обхода DOM, чтобы найти скрытый ввод после него, который ятакже дан класс.

Используйте правильное имя переменной (data+i недопустимо) и не вызывайте eval(data).

$(document).ready(function() {
  $('.toggle').change(function(i) {
    var mode = $(this).prop('checked');
    var data = $(this).next('.building').val();
    $.ajax({
      type: 'POST',
      dataType: 'JSON',
      url: 'admin/sites/audio_alarm.php',
      data: {
        mode: mode,
        building_id: data
      },
      success: function(data) {
        message = data.message;
        success = data.success;
        $("#heading").html(success);
        $("#body").html(message);
      }
    });
  });
});
<input type="checkbox" name="toggle" class="toggle" data-toggle="toggle" data-off="Disabled" data-on="Enabled">
<input type="hidden" name = "building_id_<?php echo $row["id"];?>" class="building" value="<?php echo $row["id"];?>">
...