2

使用开源剑道网络的 MVC 3 网络应用程序。

控制器将数据传递给他的视图,剑道渲染完美。

我希望能够搜索名字和姓氏,所以我有文本框和搜索按钮。搜索按钮触发对具有 json 结果的方法的 ajax 调用。使用 web developer II 可以看到请求成功返回,并且包含数据,但不显示。我使用的是表格,而不是 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>

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

4

1 回答 1

4

我最终来到这里,因为有一个类似的问题,尽管我使用 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,并且没有使用剑道网格(或数据源)来更新自身。看看这里的演示: http ://demos.kendoui.c​​om/web/grid/remote-data.html

于 2013-05-10T09:28:36.143 回答