使用开源剑道网络的 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>
不知道我哪里出错了。我认为这与从请求返回数据的方式有关,例如存在某种兼容性问题,因此无法呈现。让我知道你在哪里看的想法。