3

jTable CRUD Jquery の各行に somelink,button を含む静的列を追加したいと考えています。たとえばjTableサイトから提供されているコードを使用しています

コードは次のとおりです。

<script type="text/javascript">

    $(document).ready(function () {

        //Prepare jTable
        $('#PeopleTableContainer').jtable({
            title: 'Table of people',
            paging: true,
            pageSize: 5,
            sorting: true,
            defaultSorting: 'Name ASC',
            actions: {
                listAction: 'PersonActionsPagedSorted.php?action=list',
                createAction: 'PersonActionsPagedSorted.php?action=create',
                updateAction: 'PersonActionsPagedSorted.php?action=update',
                deleteAction: 'PersonActionsPagedSorted.php?action=delete'
            },
            fields: {
                PersonId: {
                    key: true,
                    create: false,
                    edit: false,
                    list: false
                },
                Name: {
                    title: 'Author Name',
                    width: '40%'
                },
                Age: {
                    title: 'Age',
                    width: '20%'
                },
                Watch: {
                    title: 'Watch',
                    width: '20%',
                    display: function (data) {
                    return '';
                },
                RecordDate: {
                    title: 'Record date',
                    width: '30%',
                    type: 'date',
                    create: false,
                    edit: false
                }
            }
        });

        //Load person list from server
        $('#PeopleTableContainer').jtable('load');

    });

</script>

ディスプレイの Watch フィールドに注目してください。行ごとに、各行の ID を持つ href をいくつか生成したいと考えています。各行のIDを取得するにはどうすればよいですか?

4

2 に答える 2

5

とても簡単です。表示 ( http://jtable.org/ApiReference#fopt-display ) オプションを参照してください。そのようなフィールドを定義できます:

TestColumn: {
    title: 'Test',
    display: function (data) {
        var $link = $('<a href="...">a link</a>');
        $link.click(function(){ /* do something on click */ });
        return $link;
    }
}
于 2013-01-29T14:52:58.300 に答える
2 
Link: {
    title: 'More Info',
    display: function (data) {
        return '<a href="@Url.Action("Index", "Demo")">More Info</a>';
    }
}
于 2013-06-13T07:59:06.597 に答える