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

Question

我有搜索产品的表格：

@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"。

Answer 1

您的路由代码会像这样。

     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;}
      ----------------
}

如果你想要这样的url，你必须使用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://----------")
}