Question

我正在开发一个绿地MVC4项目，并且需要一个好的MVC网格来支持分页和排序（我想要自己处理分页和排序，而不是在网格中）。我也喜欢网格是轻量级的（因为我希望控制html标记和查询参数）并且能够将lambda表达式用于列。

我以前在较旧的MVC2项目中使用了MvcContrib Grid，并且对可扩展性非常满意。我已经在这个项目中对webhelper网格进行了一些实验，但它似乎没有像MvcContrib网格那样可扩展。然而，MvcContrib项目似乎不再像以前那样积极维护。据我所知，主要版本适用于MVC2，我真的不想在全新的绿地项目中发布兼容性。

有谁知道MvcContrib项目是否会发布MVC4的新版本？现在还有其他轻量级和最新的MVC网格吗？

更新我最终编写了自己的网格组件（和一个寻呼机组件），其语法风格松散地基于MvcContrib，可以交换渲染器。

Answer 1

您是否查看了jQuery Datatables http://www.datatables.net/

我最近从MVCContrib Grid迁移到jQuery Datatables。它们非常棒。

以下是我们如何初始化表格。

BindTable: function () {
        var that = this;
        this.Table = $('#sorting-advanced');
        var tableStyled = false;

        this.Table.dataTable({
            'aoColumnDefs': [
                { 'aTargets': [1], 'sType': 'num-html' },
                { 'aTargets': [3], 'sType': 'currency' },
                { 'aTargets': [5], 'bSortable': false, }
            ],
            'sPaginationType': 'full_numbers',
            'sDom': '<"dataTables_header"lfr>t<"dataTables_footer"ip>',
            'fnDrawCallback': function (oSettings) {
                // Only run once
                if (!tableStyled) {
                    that.Table.closest('.dataTables_wrapper').find('.dataTables_length select').addClass('select').styleSelect();
                    tableStyled = true;
                }
            }
        });
    },

这是Razor View

  <table class="table responsive-table" id="sorting-advanced">
            <thead>
                <tr>
                    <th scope="col">Date</th>
                    <th scope="col">Document #</th>
                    <th scope="col">Tenant</th>
                    <th scope="col">Amount</th>
                    <th scope="col" class="align-center">Reconciled</th>
                    <th scope="col" class="align-center">Actions</th>
                </tr>
            </thead>
            <tbody>
                @foreach (var item in Model.Items)
                {
                    <tr>
                        <td>@item.Date.ToShortDateString()</td>
                        <td>
                            <a href="@Url.Action("Edit", new {id = item.Id})">@item.Number</a>
                        </td>
                        <td>@item.Contact.DisplayName</td>
                        <td>@item.Amount.ToString("C2")</td>
                        <td class="align-center">
                          @Html.CheckBoxFor(x => item.Reconciled, new {id = item.Id})
                        </td>
                        <td class="align-center vertical-center">
                            <span class="button-group compact">

                                <a href="@Url.Action("Edit", new {id = item.Id})" 
                                   class="button icon-pencil with-tooltip"
                                   title="Edit Payment"></a>

                                <a href="#" id="@item.Id" 
                                   class="button icon-trash with-tooltip confirm-delete"
                                   title="Delete Payment"></a>
                            </span>
                        </td>
                    </tr>
                }
            </tbody>
        </table>

MVCContrib MVC4的网格替代品

1 个答案: