Не получается внедрить ajax.reload()

[Nexus]

weirdjava, обновил пост №9

[weirdjava]

Nexus,
Проблема решена!
Спасибо!

[weirdjava]

Nexus,
Решил повесить еще обработчики на новую кнопку,все работает;но столкнулся с проблемой, как в данном варианте можно приходящие в строку true и false преобразовать в activate и deactivate?



как вместо false вывести deactivate и соотвтственно true - activate ;

$(document).ready(function() {

    var __getTable_timeout = 0;



    function getTable() {

        clearTimeout(__getTable_timeout);

        $.ajax({

            url: "monitor/all",

        type: "GET",

        dataType: "json",

        success: function(response) {

            var trHTML = '';

            $.each(response, function(key, value) {

                trHTML += '<tr><td>' + value.id + '</td><td>'
                    + value.url + '</td><td>'
                    + value.exceptedHttpResponseCode + '</td><td>'
                    + value.status + '</td><td>'
                    + value.active + '</td>' +
                    '<td><button data-id="' + value.id + '" + value.id + class="btn btn-danger btn-sm delBtn">Delete</td>' +
                    '<td><button data-id="' + value.id + '" + value.id + class="btn btn-danger btn-sm activeBtn">On/Off</td></tr>';

            });

            $('#monitorTable').html(trHTML);

            __getTable_timeout = setTimeout(getTable, 250);

        }

    });

    };

    getTable();



    $("#frm").on("submit", function(event) {

        event.preventDefault();

        $.ajax({

            url: "/monitor/add",

        type: "post",

        data: JSON.stringify({

                'url': $('input[name=url]').val(),

        'exceptedHttpResponseCode': $('input[name=exceptedHttpResponseCode]').val()

    }),

        contentType: "application/json",

        success: getTable,
    });

    });



    $('#monitorTable').on('click','button.delBtn',function(){
        var id = $(this).data('id');

        $.ajax({
            url: '/monitor/delete/' +$(this).data('id'),
        type: 'DELETE',
        dataType: "json",
        success: getTable

    });

    });

    $('#monitorTable').on('click','button.activeBtn',function(){
        var id = $(this).data('id');

        $.ajax({
            url: '/monitor/deactive/' +$(this).data('id'),
            type: 'POST',
            dataType: "json",
            success: getTable

        });

    });
    $('#monitorTable').on('click','button.activeBtn',function(){
        var id = $(this).data('id');

        $.ajax({
            url: '/monitor/active/' +$(this).data('id'),
            type: 'POST',
            dataType: "json",
            success: getTable

        });

    });


});

Простите,если задолбал с этим;просто не могу найти как сделать;

[laimas]

var id = $(this).data('id');
$.ajax({
url: '/monitor/delete/' +$(this).data('id'), - тогда это зачем?

Три кнопки используют один и тот же метод различающийся только параметром URL, а значит достаточно иметь один обработчик для всех кнопок.

[weirdjava]

laimas, понимаю,что это не очень правильно,но как при таком варианте можно сделать что бы вместо false и true выводилось activate и deactivate?

[Nexus]

(true?'de':'')+'activate'

[laimas]

как при таком варианте можно сделать что бы вместо false и true выводилось activate и deactivate?

Можно и так

['deactivate', 'activate'][+Boolean] - где Boolean булево значение.

Что касается кода, то все же просто - кнопки определены, а значит можно определить и параметры, которые использует единый обработчик. Вот только как понять, что у кнопки .activeBtn два обработчика, но с разными адресами запроса (строки 89 и 101)? Тут явно ошибка.

По идее кнопкам можно задать (отмеченное красным это как понимать?):

<button data-adr="delete/' + value.id+ '" data-type="DELETE" + value.id + class="btn btn-danger btn-sm delBtn">Delete</td>

и другим соответственно. И единый обработчик:

$('#monitorTable').on('click', 'button', function(){
        $.ajax({
            url: '/monitor/' +$(this).data('adr'),
        type: $(this).data('type'),
        dataType: "json",
        success: getTable
     });