Question

我是Asp.net MVC的新手。我有在Webforms工作的经验，我广泛使用转发器和网格视图来进行数据绑定，内联编辑，排序和分页。

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

一个选项是Jqgrid，但我对JSON没有太多了解。另一个是MVC中的Web网格助手。

我怀疑这是否能够在网格帮助器中填充控件并能够进行内联编辑？

我非常担心MVC的这一部分而且费用MVC与网络游戏相比让生活变得更加艰难但是我仍然希望使用MVC，因为其他的东西，比如Clean html输出和漂亮的URL。

因此，请根据上述要求，给出您的Valuble sugesstions哪些控件更适合。

Answer 1

我相信你是以错误的方式思考MVC（从webforms转移时很常见）

对于您的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>

Answer 2

在MVC中，您可以使用Controller将（视图）模型绑定到View。在ViewModel中，您可以定义显示视图所需的一切。我会告诉你一个小例子。

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);
}

包含该表的View，这是数据绑定部分。在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插件来创建具有内联编辑功能的网格等。有关选项，请参阅this question。

Answer 3

我们从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>

哪个控件用于绑定MVC中的数据？

3 个答案: