Java 从jquery jtable向控制器发送所选记录

Java 从jquery jtable向控制器发送所选记录,java,jquery,spring-mvc,jquery-jtable,Java,Jquery,Spring Mvc,Jquery Jtable,我想从jtable中选择多个记录并发送到我的spring控制器。 到目前为止,我已经做了: HTML JS 我可以得到所选记录的列表。我想添加一个按钮,将此列表发送到控制器。但我不知道怎么做。 有人知道答案吗?在使用按钮单击事件处理程序之前,我已经实现了类似的功能,然后使用ajax发回控制器: $('#YourButton').on('click', function(e) { e.preventDefault(); var selectedRows = $('#YourJTable')

我想从jtable中选择多个记录并发送到我的spring控制器。 到目前为止,我已经做了:

HTML

JS

我可以得到所选记录的列表。我想添加一个按钮,将此列表发送到控制器。但我不知道怎么做。
有人知道答案吗?

在使用按钮单击事件处理程序之前,我已经实现了类似的功能,然后使用ajax发回控制器:

$('#YourButton').on('click', function(e) {
  e.preventDefault();
  var selectedRows = $('#YourJTable').jtable('selectedRows');
  if (selectedRows.length > 0) {
     // build array of records
     var arrayRecords = new Array();
     selectedRows.each(function (index, element) {
        arrayRecords[index] = $(this).data('record');
     });

    // array to JSON
    var dataModel = JSON.stringify(arrayRecords);

    // use ajax to post back to controller
    $.ajax({
       url: 'YourControllerAction',
       type: 'POST',
       dataType: 'json',
       data: dataModel,
       contentType: 'application/json; charset=utf-8',
       success: function (data) {
            // handle success case
        },
        error: function (err) {
            // handle error case
        }
    });
  }
}
$(document).ready(function() {              
    //setup the jtable that will display the results
    $('#StudentTableContainer').jtable({
        title: 'Table of Student',
        paging: true, //Enable paging
        pageSize: 10, //Set page size (default: 10)
        sorting: true, //Enable sorting
        selecting: true, //Enable selecting
        multiselect: true, //Allow multiple selecting
        selectingCheckboxes: true, //Show checkboxes on first column
        actions: {
            listAction: 'datatable/getAllStudents',
            createAction: 'datatable/CreateStudent'
        },
        fields: {
            id: {
                title: 'iD',
                key: true,
                list: true,
                create: false,
                edit: false
            },
            name: {
                title: 'name',
                width: '50%'
            },
            age: {
                title: 'age',
                width: '30%'
            }

        },

         //Register to selectionChanged event to hanlde events
        selectionChanged: function () {
            //Get all selected rows
            var $selectedRows = $('#StudentTableContainer').jtable('selectedRows');

            $('#SelectedRowList').empty();
            if ($selectedRows.length > 0) {
                //Show selected rows
                $selectedRows.each(function () {
                    var record = $(this).data('record');
                    $('#SelectedRowList').append(
                        '<b>StudentId</b>: ' + record.id +
                        '<br /><b>Name</b>:' + record.name + '<br /><br />'
                        );
                });
            } else {
                //No rows selected
                $('#SelectedRowList').append('No row selected! Select rows to see here...');
            }
        },


        recordsLoaded: function () {

            $(".jtable tbody").sortable({
                cursor: 'move',
                opacity: 0.9,
                axis: 'y',
                start: function (event, ui) {
                    if ($.browser.webkit) {
                        wscrolltop = $(window).scrollTop(); // bug fix
                    }
                },
                sort: function (event, ui) {
                    if ($.browser.webkit) {
                        ui.helper.css({ 'top': ui.position.top + wscrolltop + 'px' });  // bug fix
                    }
                },
                update: function(event, ui) {

                    // do jquery HERE on sort

                }

            }).disableSelection();

        },

    });
    $('#StudentTableContainer').jtable('load');       



});
$('#YourButton').on('click', function(e) {
  e.preventDefault();
  var selectedRows = $('#YourJTable').jtable('selectedRows');
  if (selectedRows.length > 0) {
     // build array of records
     var arrayRecords = new Array();
     selectedRows.each(function (index, element) {
        arrayRecords[index] = $(this).data('record');
     });

    // array to JSON
    var dataModel = JSON.stringify(arrayRecords);

    // use ajax to post back to controller
    $.ajax({
       url: 'YourControllerAction',
       type: 'POST',
       dataType: 'json',
       data: dataModel,
       contentType: 'application/json; charset=utf-8',
       success: function (data) {
            // handle success case
        },
        error: function (err) {
            // handle error case
        }
    });
  }
}