如何使用@ Html.BeginRouteForm搜索表单

时间:2016-04-10 05:21:09

标签: asp.net-mvc asp.net-mvc-5

我有搜索产品的表单:

@using (Html.BeginForm("Search", "Results", FormMethod.Get, htmlAttributes: new { @class = "navbar-form navbar-left", role = "search" }))
{
    <div class="form-group">
        <input type="text" name="txtSearch" class="form-control" placeholder="Products name..." />
        @Html.DropDownList("CategoryId", null, "Select category", new { @class = "form-control" })
        <select class="form-control" id="FromPrice" name="FromPrice">
            <option value="0">From price</option>
            <option value="2000000">2,000,000d</option>
            <option value="4000000">4,000,000d</option></select><select class="form-control" id="ToPrice" name="ToPrice">
            <option value="0">To price</option>
            <option value="2000000">2,000,000d</option>
            <option value="4000000">4,000,000d</option>
            <option value="6000000">6,000,000d</option>                    
        </select>
        <input type="submit" class="btn btn-danger form-control" value="Search" />
    </div>
}

RouteConfig文件中的路由

routes.MapRoute(
    name: "SearchForm",
    url: "ket-qua/{txtSearch}-{CategoryId}-{FromPrice}-{ToPrice}",
    defaults: new { controller = "Results", action = "Search"}
)

当我使用所有参数提交上面的搜索表单时,如何调用路径“SearchForm”。

1 个答案:

答案 0 :(得分:3)

您的路由代码会是这样的。

     routes.MapRoute(
       name: "SearchForm",
       url: "ket-qua/",
      defaults: new { controller = "Results", action = "Search"}
      )

在您的视图代码中,它将是这样的。

    @using (Html.BeginRouteForm("SearchForm", FormMethod.Get, htmlAttributes: new { @class = "navbar-form navbar-left", role = "search" }))

{

您的控制器代码将是这样的。

  [ValidateInput(false)]
  public ActionResult Search(SearchModel model)
    {


    }

    public class SearchModel
    {
           public string txtSearch {get;set;}
           ----------------
    }

如果你想要你的网址。你必须使用javascript。并且必须更改控制器代码并查看代码。

     <input type="button" class="btn btn-danger form-control" value="Search"      onclick="newDoc()" />
       function newDoc() {
        //here you bind all your data
        window.location.assign("http://----------")
        }