2016-12-02 17 views
1

У меня есть основное приложение asp.net. Я использую jQuery ajax для отправки данных на сервер. Когда сервер получает модель, он обновляет все свойства модели с помощью метки времени и возвращает частичный вид с обновленной моделью. На стороне клиента JQuery просто помещает HTML ответа внутри divHtml не обновляется после сообщения ajax в asp.net core

Ниже мой пример кода

Модель Класс

public class MyModel 
{ 
    public string FirstName { get; set; } 

    public string LastName { get; set; } 

    public string City { get; set; } 
} 

Контроллер

public class HomeController : Controller 
    { 
     public IActionResult Index() 
     { 
      return View(new MyModel { FirstName = "Foo", LastName = "Bar", City = "Dallas" }); 
     }   

     public IActionResult PostData(MyModel model) 
     { 
      model.FirstName = model.FirstName + string.Format(" {0:ss}", DateTime.Now); 
      model.LastName = model.LastName + string.Format(" {0:ss}", DateTime.Now); 
      model.City = model.City + string.Format(" {0:ss}", DateTime.Now); 

      return PartialView("_MyPartialView", model); 
     } 
    } 

Index Просмотр

@model MyModel 
<div id="mydetail"> 
    @Html.Partial("_MyPartialView.cshtml", Model) 
</div> 

_MyPartialView

@model MyModel 

<form id="myform"> 
    <div class="readonly"> 
     This is readonly section. This section gets refreshed after POST 
     @Model.FirstName 
     @Model.LastName 
     @Model.City 
    </div> 
    <div class="row"> 
     <div class="col-lg-3"> 
      <input asp-for="FirstName" /> 
     </div> 
     <div class="col-lg-3">    
      @Html.TextBoxFor(x=>x.LastName) 
     </div> 
     <div class="col-lg-3"> 
      <input id="City" name="City" type="text" value="@Model.City" /> 
     </div> 
    </div> 
    @DateTime.Now.ToString() 
</form> 

Javascript

$(function() { 
    var form = $("#myform"); 
    $('#btn').click(function() { 
     $.ajax({ 
      cache: false, 
      type: 'POST', 
      url: '/home/postdata', 
      data: form.serialize(), 
      dataType: 'html',    
      contentType: 'application/x-www-form-urlencoded; charset=UTF-8' 
     }) 
     .done(function (response, textStatus, jqXHR) { 
      $('#mydetail').html(response); 
     }) 
     .fail(function (response, textStatus, errorThrown) { 
      alert(response); 
     }) 
    }) 
}) 

MyModel имеет 3 свойства FirstName, LastName и City. Для демонстрационной цели я использую 3 разных способа отображения этих свойств как TextBox.

Шаги

  1. Пользователь нажимает на кнопку, чтобы опубликовать модель на сервер.
  2. Сервер получает модель и добавляет модель с меткой времени (в секундах).
  3. Сервер возвращает частичный вид с обновленной моделью.
  4. В частичном представлении только для чтения данные записываются как текст. например @ Model.FirstName, @ Model.LastName, @ Model.City
  5. Частичный вид также отображает свойства как input. (Обратите внимание, каждое поле ввода использует другой синтаксис)

Выпуска
После успешного POST, когда частичный вид визуализируется только тогда readonly раздел и City свойства получают обновляются, и я увидеть обновленные данные. Однако FirstName и LastName не обновляется. Почему input Поле, которое использует Tag-Helper и Html Helper, не освежилось?

это ошибка в ASP.NET Core?

+0

вы пытались использовать InsertionMode = заменить в АЯКС форме? – Yaser

ответ

2

Попробуйте очистить состояние модели, позвонив по номеру ModelState.Clear(), прежде чем обновлять свою модель во время действия метода Post. Это приведет к тому, что элементы ввода в вашем (частичном) представлении отражают любые изменения в модели.

Я думаю, что ваш сценарий такой же, как то, что я столкнулся в вопросе, поэтому я разместил 3-х лет назад, и вот the answer I got

ModelState.Clear() is required to display back your model object

+0

Ну, перенаправление будет обновлять всю страницу .. и я стараюсь не перезагружать всю страницу – LP13

+0

@ LP13, как вы сначала визуализируете свою форму? Я предполагаю, что у вас есть метод действия Get в вашем контроллере. –

0

ответ Фрэнк решает проблему и с помощью ModelState.Clear(); получите пример работы как и ожидалось.

После изучения источника, вот почему я думаю, что это работает: HtmlHelper генерирует входной тег, используя DefaultHtmlGenerator. Он использует метод GenerateInput, который сначала пытается получить значение от ModelState, и если значение не найдено [это происходит после ModelState.Clear();], то оно использует текущее значение модели.

Соответствующий код ниже от источника:

case InputType.Text: 
    default: 
     var attributeValue = (string)GetModelStateValue(viewContext, fullName, typeof(string)); 
     if (attributeValue == null) 
     { 
      attributeValue = useViewData ? EvalString(viewContext, expression, format) : valueParameter; 
     }  

 Смежные вопросы

  • Нет связанных вопросов^_^