Kendo ui 剑道UI网格，窗体在弹出窗口中

我想为ajax调用实现单独的表单。我想有一个命令，它打开一个新的弹出窗口和一个字段，用户填写这个字段，然后单击“发送”，然后我做一个ajax调用控制器。我的代码：

                   $(document).ready(function () {
                        var grid = $("#memberList-grid").kendoGrid({
                                dataSource: {
                                    type: "json",
                                    transport: {
                                        read: {
                                            url: "@Html.Raw(Url.Action("MemberSearchList", "RandomPoolSelection"))",
                                            type: "POST",
                                            dataType: "json",
                                            data: function () {
                                                var data = {
                                                    SearchMember: $('#@Html.IdFor(model => model.SearchMember)').val(),
                                                    SelectionId: $('#SelectionId').val()
                                                };
                                                addAntiForgeryToken(data);
                                                return data;
                                            }
                                        }
                                    },
                                    schema: {
                                        data: "Data",
                                        total: "Total",
                                        errors: "Errors"
                                    },
                                    error: function (e) {
                                        display_kendoui_grid_error(e);
                                        // Cancel the changes
                                        this.cancelChanges();
                                    },
                                    pageSize: @(Model.PageSize),
                                    serverPaging: true,
                                    serverFiltering: true,
                                    serverSorting: true
                                },
                                pageable: {
                                    refresh: true,
                                    pageSizes: [@(Model.AvailablePageSizes)],
                                    @await Html.PartialAsync("_GridPagerMessages")
                                },
                                scrollable: false,
                                columns: [
                                    {
                                        field: "PrimaryID",
                                        title: "@T("PoolMemberList.Fields.PrimaryID")",
                                        width: 150
                                    },
                                    {
                                        field: "FirstName",
                                        title: "@T("PoolMemberList.Fields.FirstName")",
                                        width: 150
                                    },
                                    {
                                        command:
                                        {
                                            text: "Exclude",
                                            click: showExclude
                                        },
                                        title: " ",
                                        width: 100
                                    }
                                ]
                            });

                        wndExclude = $("#exclude")
                            .kendoWindow({
                                title: "Excuse Reason",
                                modal: true,
                                visible: false,
                                resizable: false,
                                width: 300
                            }).data("kendoWindow");

                        excludeTemplate = kendo.template($("#excludeTemplate").html());

                    });

                    function showExclude(e) {
                        e.preventDefault();

                        var dataItem = this.dataItem($(e.currentTarget).closest("tr"));
                        wndExclude.content(excludeTemplate(dataItem));
                        wndExclude.center().open();
                    }

和模板：

                <script type="text/x-kendo-template" id="excludeTemplate">
                    <div id="exclude-container">
                        <input type="text" class="k-input k-textbox" id="note">
                        <br />

                    </div>
                </script>

---

如何实现将此数据（带ID）发送到控制器？

一种简单的方法是使用

局部视图。


这是您的
命令网格

{
  command:
  {
       text: "Exclude",
       click: showExclude
  },
  title: " ",
  width: 100
}


这里是您的功能：

函数showExclude（e）{
$（document.body）.append（“”）；
var dataItem=this.dataItem（$（e.currentTarget）.closest（“tr”）；
$（“#不包括窗口”）.kendoWindow({
宽度：“80%”，
标题：“excludeForm”，
莫代尔：是的，
可调整大小：false，
内容：“/YourController/GetPartial？id=“+dataItem.id，
行动：[
“结束”
],
刷新：函数（）{
$（“#排除窗口”）.data（'kendoWindow'）.center（）；
},
关闭：函数（）{
setTimeout（函数（）{
$（“#排除窗口”）.kendoWindow（'destroy'）；
}, 200);
}
}).数据（“kendoWindow”）；
}

单击按钮后，加载窗口（弹出窗口）并调用加载
局部视图的操作
，以填充
窗口的
内容
。


您可以将任何需要的内容传递到您的
局部视图
（例如，这里我只发送
Id
）

公共操作结果GetPartial（Guid id）
{
var viewModel=新ViewModelExclude
{
Id=Id，
};
返回PartialView（“_exclude”，viewModel）；
}

而
局部视图
是这样的：

@model视图模型排除
@使用（Html.BeginForm（“，“您的操作”，FormMethod.Post，new{id=“SendForm”}））
{
发送
}

然后单击
send
按钮后调用ajax：

$（“#发送表单”）.submit（函数（e）{
e、 预防默认值（）；
变量形式=$（此）；
var formData=新formData（本）；
$.ajax({
类型：“POST”，
url:'@url.Action（“发送”、“您的控制器”），
数据：formData，
contentType:false，
processData:false，
成功：功能（数据）{
},
错误：函数（数据）{
}
});
});

您的
发送
操作如下：

[HttpPost]
公共操作结果发送（ViewModelExclude视图）
{
....
返回Json（）；
} 
showExclude
函数的
variable
e
根本没有
dataItem
属性您可以在
showExclude
函数中获得
dataItem
，如下所示：
var dataItem=this.dataItem（$（e.currentTarget）.closest（“tr”）非常感谢！但如果弹出窗口关闭，则无法再次打开：（我认为不是。我们必须关闭窗口，这与网格无关。我更新了答案。请检查它。尝试添加
$（document.body）。追加（“”）创建窗口时，在函数中使用
并使用
destroy
方法。我认为它无法再次打开，因为它只是第一次加载，当你销毁时，没有对象可再次打开，因此每次需要打开时都附加div即可解决问题。请尝试并告诉我结果。是的，我只是将其用于更多c拉里蒂，我会更新的，谢谢。