从 jquery 函数中调用 @(Html.Kendo().Grid

Question

我正在使用 razor asp.net mvc 4 显示剑道网格​​。我有一系列按钮，每个按钮显示不同的网格。因此，我在单击时使用 jquery 来获取按钮事件。然后我只是清除 dom 的网格部分，并在其位置重新加载新网格。也就是说，我不想使用 href 重新加载整个页面，因为只想加载一个部分。

我的问题是，我如何从 jQuery 中调用 @(Html.Kendo().Grid，因为它通常甚至不位于脚本中，并且在放入时显示所有语法错误。

如你所见，我对模型或函数的使用不是很熟练，如果一个函数是答案，放在哪里。任何帮助将不胜感激。

伊恩

Answer 1

我不确定您是否只是尝试在两个网格之间来回切换，或者您是否也尝试返回服务器以获取更新的数据。

第一种方法更简单。让我知道这是否适合您：

基本上，为两个网格编写代码（这样它们都在页面加载时初始化），但关闭一个的可见性。然后，使用 jQuery 在点击时切换两个网格的可见性。

jQuery

function toggleGridView(on, off) {
    var gridToShow = "#Grid" + on + "Container";
    var gridToHide = "#Grid" + off + "Container";
    $(gridToShow).show();
    $(gridToHide).hide();
}

查看标记

<a class="k-button" href="#_" onclick="toggleGridView('1', '2')">Show Grid 1</a>
<a class="k-button" href="#_" onclick="toggleGridView('2', '1')">Show Grid 2</a>

<div id="container">
<div id="Grid1Container">
    @(Html.Kendo().Grid(Model.UserModel.UserAddressBook)
        .Name("Grid1")
        .Columns(columns =>
        {
            columns.Bound(i => i.CompanyName).Width(120).HtmlAttributes(new { id = "CompanyName" });
            //Other column data
        })
    )
</div>
<div id="Grid2Container" style="display:none;">
    @(Html.Kendo().Grid(Model.UserModel.UserProductBook)
        .Name("Grid1")
        .Columns(columns =>
        {
            columns.Bound(i => i.Description).Width(120).HtmlAttributes(new { id = "Description" });
            //Other column data
        })
    )    
</div>