0

我对 Asp.net MVC 很陌生。我有在 Web 表单上工作的经验,我在其中广泛使用转发器和网格视图来进行数据绑定、内联编辑、排序和分页。

但是,现在有了 MVC,一切都不同了,我们不应该使用 ASP.net 服务器控件。所以,我开始在 MVC 中寻找网格视图的替代方案。但是,我在选择一个时遇到了困难。

一个选项是 Jqgrid ,但我对 JSON 了解不多。另一个是 MVC 中的 Web 网格助手。

我的疑问是我是否能够在 Web 网格助手中填充控件并能够进行内联编辑?

我非常担心 MVC 的这一部分,我认为 MVC 与 web froms 相比让生活变得更加困难,但我仍然想使用 MVC,因为其他的东西,比如干净的 html 输出和漂亮的 URL。

因此,请给出您的宝贵建议,说明哪些控件对于上述要求更可取。

4

3 回答 3

2

我相信您以错误的方式考虑 MVC(从 Web 表单迁移时很常见)

对于您的 GridView 示例,我们可以将其与 html 表进行比较。为了在 MVC 中创建一个 html 表,我们需要以下内容:

@* This tells the page what object you are supplying as the data for the page *@
@model IEnumerable<MyWebsite.TableDataViewModel>

<table>
    <thead>
        <tr>
            <th>Header 1</th>
            <th>Header 2</th>
            <th>Header 3</th>
            <th>Header 4</th>
        </tr>
    </thead>
    <tbody>
        @* Here we are looping through each item in the 
           Model (defined above) and putting each property 
           in a cell of the table *@
        @foreach(var row in Model)
        {
        <tr>
            <td>@item.Property1</td>
            <td>@item.Property2</td>
            <td>@item.Property3</td>
            <td>@item.Property4</td>
        </tr>
        }
    </tbody>
</table>
于 2013-10-03T14:36:20.653 回答
2

在 MVC 中,您使用控制器将(视图)模型绑定到您的视图。在 ViewModel 中,您定义了显示视图所需的一切。我给你看一个小例子。

视图模型:

public class CustomerModel
{
    public int Id { get; set; }
    public string Name { get; set; }
    public string EmailAddress { get; set; }
}

控制器中创建 ViewModel 的操作。我用作db.Customers数据的来源:

public ActionResult List()
{
    var customerModel = db.Customers.Select(c => new CustomerModel
                                                     {
                                                        Id = c.Id,
                                                        Name = c.Name,
                                                        EmailAddress = c.EmailAddress
                                                     }).ToList();
    return View(customerModel);
}

包含表格的视图,这是数据绑定部分。在 WebForms 中,您使用类似Eval()Bind()此处的方法,在 MVC 中,您创建强类型视图。

@model IEnumerable<CustomerModel>

<table>
    <tr>
        <th>@Html.DisplayNameFor(m => m.Id)</th>
        <th>@Html.DisplayNameFor(m => m.Name)</th>
        <th>@Html.DisplayNameFor(m => m.EmailAddress)</th>
    </tr>
    @foreach (CustomerModel customer in Model)
    {
        <tr>
            <td>@Html.DisplayFor(m => m.Id)</td>
            <td>@Html.DisplayFor(m => m.Name)</td>
            <td>@Html.DisplayFor(m => m.EmailAddress)</td>
        </tr>
    }
</table>

现在,您可以使用大量可用的 jQuery GridViews 插件之一来创建具有内联编辑等功能的网格。有关一些选项,请参阅此问题

于 2013-10-03T14:37:15.560 回答
1

我们有点从 webforms 切换回 mvc,我更喜欢这就是我们做网格的方式。看起来像这样https://datatables.net

<script type="text/javascript" charset="utf-8">
            $(document).ready(function () {
                $('#example').dataTable();
            });
</script>

    <table id="example" border="1">
     <thead>
            <tr>
                <th>Bill Number</th>
                <th>LR Number</th>          
                <th>Previous Year</th>
                  <th>Committee Rec</th>
                <th>Committee</th>
                <th>Save</th>
            </tr>
        </thead>
        <tbody>
    @for (int i = 0; i < Model.billVersion.Count; i++)
    {<tr>
        <td>@Html.DisplayFor(model => model.billVersion[i].billNumber)</td>
        <td>@Html.DisplayFor(model => model.billVersion[i].lrNumber)</td>
        <td>@Html.DisplayFor(model => model.billVersion[i].previousYear)</td>
        <td>@Html.DisplayFor(model => model.billVersion[i].committeeRec)</td>
        <td>@Html.CheckBoxFor(model => model.billVersion[i].save_Remove)</td>
    </tr>                
    }
    </tbody>
于 2013-10-03T14:29:34.120 回答