MVC 3 (Razor) - Стандартный способ использования события Button для вызова контроллера

У меня есть простое представление Wall.cshtml, которое загружает _Search.cshtml Partial View, который выглядит следующим образом:

<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:. Поскольку это частичный вид, как мне сделать представление, содержащее текущий частичный поиск, для обновления и обновления самого результата запроса поиска?

Ответы

Ответ 1

Лучше использовать форму и сделать кнопку поиска submit:

@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, который будет содержать результаты поиска, возвращенные из действия контроллера.

Ответ 2

проблема заключалась в том, что <input id="Search" type="button" value="Search" />
имеет тип = BUTTON

Я изменил тип INPUT... и это устранило проблему.

Ответ 3

Не забудьте сериализовать данные, чтобы также нажать кнопку "Модель" для действия контроллера:

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