Question

使用开源kendo网站的MVC 3网络应用。

控制器传递他查看的数据，并且剑道渲染完美。

我希望能够搜索名字和姓氏，所以我有文本框和搜索按钮。搜索按钮触发对具有json结果的方法的ajax调用。使用Web开发人员，我可以看到请求成功返回并包含数据，但不显示。我使用的是表，而不是div，因此我不必将数据绑定到列。我见过一些解决方案，但他们都认为我有mvc插件，我不知道。

控制器：

    [HttpGet]
    public ActionResult Index()
    {
        var model = new List<PersonViewModel>();

        model = repo.GetPeople();


        return View(model);
    }



    public JsonResult _SearchResult(string fname, string lname)
    {
        var personResult = repo.GetSearchResult(fname, lname);

        return Json(personResult, JsonRequestBehavior.AllowGet);
    }

}

使用jquery查看：

        <div id="search-index">
                <div class="editor-field">   
                    <label>First Name:</label>
                    @Html.TextBox("FirstName")

                    <label style = "margin-left: 15px;">Last Name:</label>
                    @Html.TextBox("LastName", "", new { style = "margin-right: 15px;" })
                </div>            
                <div id="search-controls-index">
                      <input type="button" id="searchbtn" class="skbutton" value="Search" />
                      <input type="button" id="addPersonbtn" class="skbutton" value="Add New Person" onclick="location.href='@Url.Action("AddPerson", "Person")'"/>
                </div>
        </div>

        <div id="result-list-index">            
             <table id="index-grid">
                   <thead>
                            <tr>
                                <th>
                                    First Name
                                </th>
                                <th>
                                    Last Name
                                </th>
                                <th>
                                    Gender
                                </th>
                                <th>
                                    Date of Birth
                                </th>
                                <th>
                                    Is a Student?
                                </th>
                                <th>
                                    Actions
                                </th>
                            </tr>
                    </thead>
                @if (Model.Count() < 1)
                {
                                            <tr>
                                            <td colspan=7>
                                                There are currently no trespassers in the trespass database - this is a partial view.
                                            </td>
                                            </tr>
                }
                else
                {
                    foreach (var item in Model)
                    {
                    <tr>
                        <td>
                            @Html.DisplayFor(modelItem => item.FirstName)
                        </td>
                        <td>
                            @Html.DisplayFor(modelItem => item.LastName)
                        </td>
                        <td>
                            @Html.DisplayFor(modelItem => item.Gender)
                        </td>
                        <td>
                            @Html.DisplayFor(modelItem => item.DOB)
                        </td>
                        <td>
                            @Html.DisplayFor(modelItem => item.IsStudent)
                        </td>
                        <td>
                            @Html.ActionLink("Edit", "Edit", new { /* id=item.PrimaryKey */ }) |
                            @Html.ActionLink("Details", "Details", new { /* id=item.PrimaryKey */ })
                        </td>
                    </tr>
                    }
                }

        </table>        



</div>

<script type="text/javascript">

    $(document).ready(function () {


            $('#index-grid').kendoGrid({
                height: 370,
                sortable: true,
                scrollable: true,
                pageable: true,
                dataSource: { pageSize: 8 }
            });


           $("#searchbtn").on('click', function () {
                var fsname = $("#FirstName").val();
                var ltname = $("#LastName").val();

                    $.ajax({
                        type: 'GET',
                        url: '@Url.Content("~/Home/_SearchResult")',
                        data: { fname: fsname, lname: ltname },
                        success: function (data) {
                            $('#index-grid').html(data);
                        },
                        error: function () {
                            $("#index-grid").html("An error occured while trying to retieve your data.");
                        }
                    });
        });
    });                    
 </script>

不确定我哪里出错了。我认为这与从请求返回数据的方式有关，就像存在某种兼容性问题一样，因此无法呈现。让我知道你在哪里看的想法。

Answer 1

我结束了这里，因为有一个类似的问题，虽然我正在使用网格的MVC包装器。没有错误，JSON返回，网格没有返回任何内容。最后，事实证明，我在控制器方法中忘记了一个简单的事情，它返回了网格的数据。

我的方法看起来像这样：

public JsonResult _SearchResult([DataSourceRequest]DataSourceRequest request)
{
    var personResult = repo.persons();

    return Json(personResult.ToDataSourceResult(request), JsonRequestBehavior.AllowGet);
}

缺少“ToDataSourceResult”调用。添加它修复了问题。这将返回的JSON格式更改为：

{"Data":[],"Total":0,"AggregateResults":null,"Errors":null}

现在问题：

您正在尝试在DOM中插入JSON，并且没有使用kendo网格（或数据源）来更新自身。看看这里的演示： http://demos.kendoui.com/web/grid/remote-data.html

Kendo grid ajax返回数据但未呈现，没有错误

1 个答案:

现在问题：