Отправьте значения строки Jquery Datatable в новую форму - PullRequest
0 голосов
/ 27 апреля 2020

У меня есть рабочий скрипт, который получает данные в таблицу. Я хочу добавить ссылку для редактирования, чтобы при нажатии на кнопку «Изменить» он попадал на страницу, где я могу изменить данные для обновления БД.

Рабочий скрипт выглядит следующим образом:

<script>
$(document).ready(function() {
    $('#tabla').DataTable({
        scrollY:        '40vh',
        scrollCollapse: true,
        paging:         true,
    ajax:{
    method: "POST",
    url: "/ServletList",
    dataSrc: "datos"
    },
    "serverSide": true,
    "processing": true,
    "columns": [
        {"data": "id","searchable":false},
        {"data": "name","searchable":true},
        {"data": "city","searchable":true},
        {"data": "country","searchable":true},
    ]   
    });
    });
</script>

И я добавил следующие строки в раздел столбцов:

{"mRender": function ( data, type, row ) {
    return '<a href=edit.jsp?id='+row.id+'>Edit</a>';}
}

edit. jsp - это форма, которая обновит значение БД после его заполнения.

У меня вопрос, как мне передать в редактирование. jsp значения, которые я выбрал в строке: id, имя, город, страна

1 Ответ

1 голос
/ 27 апреля 2020

Я думаю, что вы можете сделать это несколькими способами, но мне пришло в голову следующее:

  • ссылка для редактирования при нажатии активирует функцию
  • эта функция будет вызывать все поля строки (связанные со строкой по нажатой ссылке)
  • получают значения этих полей и формируют их в виде строки URL
  • , перенаправляют на страницу редактирования jsp и читают URL, содержащий значения

код для этого:

{"mRender": function ( data, type, row ) {
    return '<a href="javascript:;" data-url="edit.jsp?id='+row.id+'" onclick="EditRowData(this);">Edit</a>';}
}

и EditRowData код функции:

<script>
    function EditRowData(element) {
        urlToEditPage = $(element).attr('data-url');
        firstValue = $(element).parents('tr').find('.firstInput').val();
        secondValue = $(element).parents('tr').find('.secondInput').val();
        //... add values as you want
        window.location.href = urlToEditPage + '&firstValue=' + firstValue + '&secondValue=' + secondValue
    }
</script>

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

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...