Блог

У меня есть частичное представление, которое включено в мой _Layout.cshtml. Это частичное представление содержит выпадающий список, который заполняется правильно.

Когда пользователь выбирает значение, я хочу, чтобы это значение было доступно везде. Поэтому я попытался установить его в своих данных сеанса.

Это работает нормально.

Частичный просмотр:

 @model MyModel

@using (Ajax.BeginForm("MySelection", "Home", new AjaxOptions()))
{
    var optionList = new SelectList(Model.Options, "Key", "Value");

    @Html.DropDownListFor(model => model.SelectedOption, optionList, 
    "--Select--", new { onchange = "this.form.submit(); return false;" })    
}
  

И, конечно же,

     [HttpPost]
    public PartialViewResult MySelection(MyModel model)
    {
        Session["MySelection"] = model.SelectedOption;
        return PartialView("_MyPartial", model);
    }
  

Получает попадание, устанавливает данные сеанса и возвращает частичное представление.

Однако… это частичное представление — все, что я вижу! Вместо того, чтобы оставаться на той же странице, отображается только частичное представление.

Я бегаю по кругу, пытаясь выяснить, как я могу просто, просто сохранить выбранное значение в своих данных сеанса, мне не нужно возвращать представление, частичное представление или что-либо еще, мне не нужно перезагружать данные, перезагружать страницу, перенаправлять куда угодно.

Что такое (несомненно, очень просто!) способ получить выбранный параметр в моих данных сеанса?

Как предположил Эхсан Саджад, убедившись, что все остальное на месте, использование (скрытой) кнопки для отправки формы выполнит ajax-запрос, тогда как this.form.submit в обработчике onchange этого не делает!

Короче говоря, теперь у меня есть:

 @model MyModel

@using (Ajax.BeginForm("MySelection", "Home", new AjaxOptions()))
{
    var optionList = new SelectList(Model.Options, "Key", "Value");

    @Html.DropDownListFor(model => model.SelectedOption, optionList, 
    "--Select--", new { onchange = "submitButton.click();" }) 
    <input type="submit" id="submitButton" class="hidden-button"/>   
}
  

и

 [HttpPost]
public void MySelection(MyModel model)
{
    Session["MySelection"] = model.SelectedOption;
}
  

И это работает как шарм.

Если вы не хотите ничего возвращать, верните EmptyResult:

 [HttpPost]
public ActionResult MySelection(MyModel model)
{
  Session["MySelection"] = model.SelectedOption;
  return new EmptyResult();
}
  

другим способом может быть использование AjaxOptions, а также создание контейнера div в основном представлении:

 <div id="container">

</div>



  @using (Ajax.BeginForm("MySelection", "Home", new AjaxOptions { HttpMethod = "POST", InsertionMode = InsertionMode.Replace, UpdateTargetId = "conatainer" }))
 {
  var optionList = new SelectList(Model.Options, "Key", "Value");

   @Html.DropDownListFor(model => model.SelectedOption, optionList, 
   "--Select--", new { onchange = "this.form.submit(); return false;" })
 }
  

и вы можете возвращать пустое содержимое следующим образом:

 [HttpPost]
public ActionResult MySelection(MyModel model)
{
   Session["MySelection"] = model.SelectedOption;
   return Content("");
}
  

ОБНОВЛЕНО:

Вам нужно добавить скрытую кнопку отправки и при изменении индекса в раскрывающемся списке программно вызвать ее щелчок, так как программная отправка формы не запускает исходную отправку, поэтому форма публикуется, не публикуется через ajax, и происходит полная обратная отправка.

Представление должно будет что-то сделать с возвращенными данными. И поскольку вы не сказали ему, что с ним делать, он прибегает к поведению по умолчанию, заменяя текущую цель возвращаемым значением.

Как насчет того onChange , чтобы событие dropdown вызова функции выглядело следующим образом:

 function SaveMySelection(paramsToPassToServer) {
    var methodParam = JSON.stringify(paramsToPassToServer);
    var methodUrl = '@Url.Action("MySelection", "Home")';
    var requestType = //GET or POST;
    var successMethod = function (srvResponse) {
    //You can do some parsing of the returned json in case you want to
    //or just ignore the returned value
    }
    $.ajax({
        type: requestType,
        url: methodUrl,
        data: requestType == "POST" ? methodParam : decodeURIComponent($.parseJSON(methodParam)),
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        processData: false,
        success: successMethod,
        error: FunctionToHandleOnError
    });
}
  

Javascript не совсем чистый, поскольку я быстро перенял «параметризованную» версию, которую мы внедрили, но это должно дать вам общее представление.