0

Сами записи выводятся из mysql. Получается код типа:

<tr><td>Запись 1</td><td><button id="delete" value="1">удалить</button></td></tr>

<tr><td>Запись 2</td><td><button id="delete" value="2">удалить</button></td></tr> 

<tr><td>Запись 3</td><td><button id="delete" value="3">удалить</button></td></tr> 

нужно реализовать удаление. прилагаю код скрипта:

$(document).ready (function() {
$("#delete").bind("click", function() {

  $.ajax ({
    url: "/user/delete",
    type: "POST",
    data: ({name: $("#delete").val()}),
    dataType: "html",
    beforeSend: function (){
      $('#delete_spinner').html('<i class="fa fa-spinner fa-spin"></i>'); 
    },
    success:function(data){ 
      alert(data)
      document.getElementById('delete_spinner' ).style.display = 'none'; 
      document.getElementById('update' ).click();
    }
  }); 
});

});

Проблема в том, что он считывает по нажатию на id="delete", а так как их много, берёт первый, соот-но удаление первой записи работает. Как сделать, чтобы удаляло любую запись?

5
  • $(this).val() потому что брать надо. Но как уже в ответах написано, для идентификации кнопки лучше сделать class="delete" id="1", иначе идентификатор не валидный.
    – teran
    Commented 5 дек. 2016 в 13:44
  • а как переписать эту строку data: ({name: $("#delete").val()}), чтобы можно было передать в скрипт каждое значение. javascript знаю очень слабо, не знаю, как это записать Commented 5 дек. 2016 в 13:55
  • дак я выше и написал как. { name: $(this).val() }
    – teran
    Commented 5 дек. 2016 в 13:57
  • вдогонку, вы же знаете, что document.getElementById('delete_spinner' ).style.display = 'none'; можно записать как $("#delete_spinner").toggle(false) или .hide() ?
    – teran
    Commented 5 дек. 2016 в 14:00
  • про hide знал, про toggle нет. спасибо, что подсказали, буду постигать JS. очень помогли, я правда написал немного по-другому, через id data: ({name: $(this).attr("id")}), но ваш вариант более понятный Commented 5 дек. 2016 в 14:07

3 ответа 3

0

ID - уникальный параметр. Нельзя использовать один и тот-же ID у разных элементов.
Для решения поставленной задачи используйте class и в обработчике на клик читайте value этого элемента или data-аттрибут

0

Согласно W3C спецификации это не валидно.

Попробуйте всем элементам заменить ID на классы, или замените селектор на следующий:

$('[id="delete"]');
-1

Пользуйтесь! Настройте под себя

Добавить к элементу

onclick="javascript:del(тут id);"

Код

function del(id){ 
    jQuery.ajax({
            type: "post",
            url: "/delete_ajax.php",
            data: "id=" + id + "&vid=lids",
            dataType: 'json',
            success: function(data){
                if(data.succes == 0){
                    jQuery('#msg').html('' + data.msg + '').delay(3000).fadeOut('fast');
                }
                if(data.succes == 1){
                    $('li[data-lidid=' + data.lidid + ']').animate({ bottom:"+=30%",opacity:0 }, "slow", function(){jQuery(this).hide();}); // удаляем удаленный элемент
                }
            }
    });
}
1
  • в чем смысл этого половина классического JS который надо искать где-то по тексту страницы, и половины JQuery?
    – teran
    Commented 5 дек. 2016 в 13:47

Ваш ответ

Нажимая «Отправить ответ», вы соглашаетесь с условиями пользования и подтверждаете, что прочитали политику конфиденциальности.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.