我有一个简单的Wall.cshtml视图加载一个_Search.cshtml部分视图,如下所示:
<h2>The Wall</h2> @{Html.RenderPartial("~/Views/Search/_Search.cshtml");}@H_301_3@_Search.cshtml部分视图(基于@Darin回复更新)如下所示:
@using (Html.BeginForm("Searching","Search",FormMethod.Post,new { id = "searchForm" })) { <div id="search"> <div id="searchbtn"> <input id="Search" type="button" value="Search" /> </div> <div id="searchtxt"> @Html.TextBox("txtSearch") </div> </div> }@H_301_3@控制器如下所示:
public class SearchController : Controller { public ActionResult Wall() { return View(); } [HttpPost] public ActionResult Searching() { // do something with the search value return View(); } }@H_301_3@当我运行应用程序时,生成的HTML块将如下所示:
<form action="/Search/Searching" id="searchForm" method="post"> <div id="search"> <div id="searchbtn"> <input id="Search" type="button" value="Search" /> </div> <div id="searchtxt"> <input id="txtSearch" name="txtSearch" type="text" value="" /> </div> </div> </form>@H_301_3@问题1:为什么按钮点击从不打到搜索控制器方法?
(让我重申_Search.cshtml是在一个名为Wall.cshtml的视图中运行的部分视图)。问题2:如何获取“txtSearch”文本框中的值?
解决方法
最好使用表单并使搜索按钮提交:
@using (Html.BeginForm("Search","Home",new { id = "searchForm" })) { <div id="search"> <div id="searchbtn"> <input id="Search" type="submit" value="Search" /> </div> <div id="searchtxt"> @Html.TextBox("txtSearch") </div> </div> }@H_301_3@就您的第二个问题而言,您可以AJAXify此搜索表单:
$(function() { $('#searchForm').submit(function() { $.ajax({ url: this.action,type: this.method,success: function(result) { $('#resultContainer').html(result); } }); return false; }); });@H_301_3@其中,resultContainer可以是一些div,它将保存控制器操作返回的搜索结果。