jquery - 在jtable中添加自定义按钮

Question

我们可以在 jtable.js 中添加自定义按钮吗？是否有任何选项可用于创建按钮？
意思是如果我想要一个创建PDF的按钮，那么我该怎么做？

Answer 1

要插入按钮，您必须使用 display: 函数，并根据您的选择对其进行自定义；即我创建了一个带有按钮的列:变量data包含当前记录的数据。

$(document).ready(function () {

    $('#StudentTableContainer').jtable({
        title: 'The Student List',
        paging: true, //Enable paging
        pageSize: 10, //Set page size (default: 10)
        sorting: true, //Enable sorting
        defaultSorting: 'Name ASC', //Set default sorting
        actions: {
            listAction: '/Demo/StudentList',
            deleteAction: '/Demo/DeleteStudent',
            updateAction: '/Demo/UpdateStudent',
            createAction: '/Demo/CreateStudent'
        },
        fields: {
            StudentId: {
                key: true,
                create: false,
                edit: false,
                list: false
            },
            Name: {
                title: 'Name',
                width: '40%'
            },
            EmailAddress: {
                title: 'Email address',
                list: false
            },
            Password: {
                title: 'User Password',
                type: 'password',
                list: false
            },
            Gender: {
                title: 'Gender',
                width: '20%',
                options: { 'M': 'Male', 'F': 'Female' }
            },
            MyButton: {
                title: 'MyButton',
                width: '40%',
                display: function(data) {
                     return '<button type="button" onclick="alert(' + data.record.StudentId + ')">create PDF</button> ';
                }
            },

        }
    });

    //Load student list from server
    $('#StudentTableContainer').jtable('load');
});