Зачем загружать-подтверждение на кодируемом коде со стороны сервера без данных, не нажимая - PullRequest
Новая
       19

Зачем загружать-подтверждение на кодируемом коде со стороны сервера без данных, не нажимая

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

У меня есть проект начальной загрузки, я использую datatables pluging. И я хочу добавить подтверждение перед удалением строки. Я могу сделать это должным образом, когда я сначала заполняю таблицу с помощью repeat и linkButton. Но я хочу сейчас, просто отправьте информацию, что мне нужно. Затем я пытаюсь сделать это в режиме сервера. Вот мой код: 

  $('#LBENEF').DataTable({
        "aaSorting": [],
        "processing": true,
        "serverSide": true,
        "ajax": "/Beneficiaire/ListBeneficiaires.asmx/GetListBenef",
        "columnDefs": [{ "orderable": false, "targets": 6 }],
        "columns": [
            { "data": null, },
            { "data": "TypeLibelle", },
            { "data": "ID_CLIENT" },
            { "data": "NomPrenom" },
            { "data": "SitLibelle" },
            { "data": "PerimLibelle" },
            { "data": null }
        ],
        "createdRow": function (row, data, index) {
            if (!data.Actif) { $('td', row).eq(0).html("<span Class='glyphicon glyphicon-ban-circle'></span>"); }
            else { $('td', row).eq(0).html(""); }
            if (data.PeutConsult) { $('td', row).eq(6).html('<a href="/edit.aspx?ID=' + data.ID + '"><span Class="glyphicon glyphicon-pencil"></span></a>'); }
            if (data.PeutSup) { $('td', row).eq(6).append('<a onclick="DelBenef(' + data.ID + ');" data-toggle="confirmation" href="#"><span class="glyphicon glyphicon-trash"></span></a>'); }
        },
        drawCallback : function (oSettings) { $('[data-toggle="confirmation"]').confirmation(paramPopOverFileList);  }
    });

    function DelBenef(IdBen) {
        $.ajax(
            {
                type: "POST", url: "/toto.asmx/DelBenef", contentType: "application/json; charset=utf-8", dataType: "json", data:'{"IdBenef":' + IdBen + "}",
                success: function (msg) {
                    if (msg.d.Reussi) { $('#LBENEF').DataTable().ajax.reload(); }
                    else { AfficheMsgRetour(msg.d); }
                },
                error: function () { //Code errors
                       }
            });
    }

Моя таблица выглядит хорошо, я могу найти или заказать ее, и я могу редактировать. Моя проблема, когда я нажимаю на значок корзины, я вижу свое всплывающее подтверждение, но в то же время функция DelBenef на toto.asmx / DelBenef ... У кого-нибудь есть идея?

Ответы [ 3 ]

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

Я создал скрипку здесь с всплывающим окном (с HTML-контентом). Изменения в коде, выполненные, чтобы заставить его работать, были -

В функции обратного вызова 

$("[data-toggle=confirmation]").confirmation({
    title: "Confirmation required!",
    html: true,
    content: "<h1> Are you sure you want to delete </h1>",
    onConfirm: function(event, element) {
        alert('Replace this alert with your ajax call!');
    }
});

Изменение функции createdRow предназначено только для проверки. Вы можете заменить его изображением, которое есть в вашем коде.

Надеюсь, это поможет!

https://jsfiddle.net/ksivasenthil/cxbacd3v/13/

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

Просто чтобы завершить ответ, предоставленный Шивой, я нахожу здесь простой метод 

 <script>
    var last_clicked_id = null;
    $('#LBENEF').DataTable({
        rowId: 'ID',
        "aaSorting": [],
        "processing": true,
        "serverSide": true,
        "ajax": "/MaPage.asmx/GetListBenef",
        "columnDefs": [{ "orderable": false, "targets": 6 }],
        "columns": [
            { "data": null, },
            { "data": "TypeLibelle", },
            { "data": "ID_CLIENT" },
            { "data": "NomPrenom" },
            { "data": "SitLibelle" },
            { "data": "PerimLibelle" },
            { "data": null }
        ],
        "createdRow": function (row, data, index) {
            if (!data.Actif) { $('td', row).eq(0).html("<span Class='glyphicon glyphicon-ban-circle'></span>"); }
            else { $('td', row).eq(0).html(""); }
            if (data.PeutConsult) { $('td', row).eq(6).html('<a href="/BENEFICIAIRE/edit.aspx?ID=' + data.ID + '"><span Class="glyphicon glyphicon-pencil"></span></a>'); }
            if (data.PeutSup) { $('td', row).eq(6).append('<a onclick="last_clicked_id=' + data.ID + ';" data-toggle="confirmation" href="#"><span class="glyphicon glyphicon-trash"></span></a>'); }
        },
        drawCallback: function (oSettings) {
            paramPopOverFileList["onConfirm"] = function (event, element) { DelBenef(); };
            $('[data-toggle="confirmation"]').confirmation(paramPopOverFileList);
        }
    });

    function DelBenef() {
        $.ajax(
            {
                type: "POST", url: "/MaPage.asmx/DelBenef", contentType: "application/json; charset=utf-8", dataType: "json", data: '{"IdBenef":' + last_clicked_id + "}",
                success: function (msg) {
                    if (msg.d.Reussi) { $('#LBENEF').DataTable().ajax.reload(); }
                    else { AfficheMsgRetour(msg.d); }
                },
                error: function () { AfficheMsgRetour({ Titre: "Désactivation bénéficiaire", Reussi: false, Msg: "Erreur accès fonction" }); }
            });
    }
</script>

Просто используйте глобальную переменную, связанную singleton = true (уже сделано).Я обновляю это в onclik на элементе ссылки.Наслаждайся этим

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

Попробуйте добавить подтверждение до $.ajax вызова 

function DelBenef(IdBen) ({
    if (window.confirm("Do you really want to delete this ?")) { 
        $.ajax({
            ...
        });
    }
})

Док

...