2011-04-06 59 views
16

我有一个加载_Search.cshtml 局部视图,看起来像这样一个简单的Wall.cshtml视图标准方式:MVC 3(剃刀) - 使用按钮事件调用控制器

<h2>The Wall</h2> 
@{Html.RenderPartial("~/Views/Search/_Search.cshtml");} 

的_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> 
} 

的控制器是这样的:

public class SearchController : Controller 
{ 
    public ActionResult Wall() 
    { 
     return View(); 
    } 

    [HttpPost] 
    public ActionResult Searching() 
    { 
     // do something with the search value 
     return View(); 
    } 
} 

当我运行应用程序,生成的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> 

问题1:为什么会点击按钮从不打搜索控制器方法?
(让我重申_Search.cshtml是在名为Wall.cshtml的视图内运行的部分视图)。

问题2:如何获得“txtSearch”文本框内的值?

问题3:由于这是一个局部视图,我该如何使包含当前搜索部分视图..的视图以搜索查询的结果进行刷新和更新?

回答

17

这将是更好地使用表格及搜索按钮提交:

@using (Html.BeginForm("Search", "Home", FormMethod.Post, 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> 
} 

至于你的第二个问题而言,你可以AJAXify这种搜索形式:

$(function() { 
    $('#searchForm').submit(function() { 
     $.ajax({ 
      url: this.action, 
      type: this.method, 
      success: function(result) { 
       $('#resultContainer').html(result); 
      } 
     }); 
     return false; 
    }); 
}); 

哪里resultContainer可能是一些div,将包含控制器操作返回的搜索结果。

+0

解决方法1是我做的事之前,但作为对更新的原始答复指出,按一下按钮永远不会到达搜索控制器方法。 – 2011-04-06 16:51:22

+0

@Filu,以及在FireBug中检查请求时会发生什么?没有到达控制器的原因是什么? – 2011-04-06 18:14:25

+0

我必须承认,我从来没有用过Firebug。我刚安装它。当我点击按钮时我要查找什么? – 2011-04-07 08:05:06

2

的问题是,<input id="Search" type="button" value="Search" />
具有类型= BUTTON

我改变了类型为INPUT ...和固定的问题。

+0

type = submit也应该在这里工作 – jcolebrand 2011-07-25 17:38:34

0

不要忘了序列化的数据也模型推到控制器动作:

@model CBS.DataAccess.Entities.SupplierQuoteEntity  
@using (Html.BeginForm("Create", "SupplierQuote", FormMethod.Post, new { id = "SupplierQuoteCreateForm" })) 
{ 
    <div>blablablabla fields...</div> 

    <a class="t-button t-button-icontext" onclick="ajaxSubmit()"><span class="t-icon t-insert"></span>Create</a> 

    <script type="text/javascript"> 
     function ajaxSubmit() { 
      var formData = $("#SupplierQuoteCreateForm").serializeArray(); 

      $.ajax({ 
       type: "POST", 
       url: '@Url.Action("Create", "SupplierQuote")', 
       data: formData, 
       dataType: "json", 
       success: function (data) { 
        alert(data); 
       } 
      }); 
     }   
    </script>  
}