Asp.net mvc 5 使用剑道网格的Asp.NETMVC主细节视图

我想创建联系人视图。我的模型是：

public class Contact
{
    public Contact()
    {
        Documents = new HashSet<Document>();
    }

    public int Id { get; set; }
    public string FirstName { get; set; }
    public string LastName { get; set; }
    public string ContactNo { get; set; }
    public string EmailId { get; set; }
    public string Address { get; set; }
    public string Notes { get; set; }
    public ICollection<Document> Documents { get; set; }
}

public class Document
{
    public Document() { }

    public int Id { get; set; }
    public int ContactId { get; set; }
    public string DocumentNo { get; set; }
    public string DocumentType { get; set; }
    public byte[] FileContent { get; set; }
    public string FileName { get; set; }
    public int ContentLength { get; set; }
}

公共类联系人
{
公众联络（）
{
Documents=新的HashSet（）；
}
公共int Id{get；set；}
公共字符串名{get；set；}
公共字符串LastName{get；set；}
公共字符串ContactNo{get；set；}
公共字符串EmailId{get；set；}
公共字符串地址{get；set；}
公共字符串注释{get；set；}
公共ICollection文档{get；set；}
}
公共类文档
{
公共文档（）{}
公共int Id{get；set；}
public int ContactId{get；set；}
公共字符串DocumentNo{get；set；}
公共字符串DocumentType{get；set；}
公共字节[]文件内容{get；set；}
公共字符串文件名{get；set；}
公共int ContentLength{get；set；}
}

---

我已经为文档创建了带有联系人详细信息和网格的视图。事实上，我是MVC新手，所以我在互联网上搜索如何实现这一点。但我还找不到任何可行的解决办法。我不知道如何在网格中添加一个或多个文档并持久化文档细节。我试图实现的是在提交表单时用上传的文档（一个或多个）保存联系人信息

您可以使用下面的代码，通过父子组合实现您想要的。 下面的代码只是一个示例，提供了详图视图的“仅视图”选项

@model Models.Contact

<div id="ModelView">
          <div >@Html.Label("Name")</div>
          <div >
            @Html.TextBoxFor(model => model.FirstName)
            @Html.TextBoxFor(model => model.LastName)
          </div>
          ...
          ...

  <div id="grid"></div>
</div>

<script>
            $(document).ready(function() {
                $("#grid").kendoGrid({
                    dataSource: {
                        data: model.Documents,
                        schema: {
                            model: {
                                fields: {
                                    //append fiels as per your document model
                                    FileName: { type: "string" },
                                    DocumentType: { type: "number" }
                                }
                            }
                        },
                        pageSize: 20
                    },
                    dataBound: OnDataBound
                    height: 550,
                    scrollable: true,
                    sortable: true,
                    columns: [
                        "FileName",
                        { field: "FileName", title: "File Name", width: "130px", clientTemplate: "<input type='file' name='docs'/>" },
                        { field: "DocumentType", title: "Document Type", width: "130px" }
                    ]
                });
            });

 function OnDataBound(e){
   $('[name=docs]').kendoUpload(
 {
     async: 
         {
            saveUrl: ......
            removeUrl: ........
            autoUpload: true
        },
        upload: onUpload, //Your custom function for uploader
        success: onSuccess //Write the below function to display approprate message
 }); 
 }
 </script>

@model Models.联系
@Html.Label（“名称”）
@Html.TextBoxFor（model=>model.FirstName）
@Html.TextBoxFor（model=>model.LastName）
...
...
$（文档）.ready（函数（）{
$（“#网格”）.kendoGrid({
数据源：{
数据：模型、文件、，
模式：{
型号：{
字段：{
//根据您的文档模型追加fiels
文件名：{type:“string”}，
文档类型：{type:“number”}
}
}
},
页面大小：20
},
数据绑定：OnDataBound
身高：550，
可滚动：对，
可排序：是的，
栏目：[
“文件名”，
{字段：“文件名”，标题：“文件名”，宽度：“130px”，客户端模板：'}，
{字段：“文档类型”，标题：“文档类型”，宽度：“130px”}
]
});
});
函数OnDataBound（e）{
$（'[name=docs]'）。kendoUpload(
{
异步：
{
saveUrl:。。。。。。
移除URL:。。。。。。。。
自动上载：true
},
upload:onUpload，//用于上载程序的自定义函数
success:onSuccess//编写以下函数以显示批准消息
}); 
}

---

注意：上面的代码将一个接一个地上传文档，而不是一次上传所有文档，只是为了负载平衡。

实际上，我有一个单一联系人模型和文档网格的视图。我的问题是如何在网格内使用上载控件，并将其与提交事件一起发布。我想上传多个文件。是的，您可以从上面实现同样的效果，唯一的区别是您需要为文档模型指定单独的创建/更新/读取控制器，以便更好地控制插入和更新。@Arun我假设您没有在网格中查看如我所示的联系人模型，对吗？是，我不使用网格作为联系人模型。假设我为文档模型使用单独的控制器，它将如何与ContactId（外键）链接？因为联系人id是在插入数据库后创建的。使用不同的控制器可以通过多种方式实现上述功能，但如果您想使用当前的结构，则上述代码也可以使用。您需要添加的唯一js函数是onSuccess，其中您需要将上传文件中的文档信息添加到网格中，以便主模型（联系人模型）捕获信息