Обновить основную форму для отображения Пользовательское сообщение проверки при возврате PartialViewResult

Question

У меня есть основной вид, и это основное представление имеет тег div, который будет содержать частичный вид после вызова Ajax на контроллер.

Вот частичный вид отвечает за инициирование Ajax вызова:

@model EDR.Presentation.WebMain.ViewModels.MvcPatientDetailsHIVViewModel 

<div class="form-group-sm"> 
    @Html.LabelFor(m => m.HIVTestTestDate, new { @class = "control-label" }) 
    @Html.EditorFor(m => m.HIVTestTestDate, new { htmlAttributes = new { @class = "form-control form-control-custom-50" } }) 
</div> 

<div class="form-group-sm"> 
    @Html.LabelFor(m => m.HIVTestTestResult, new { @class = "control-label" }) 
    @Html.DropDownListFor(m => m.HIVTestTestResult, Model.SelectList_HIVTestedResult, new { @class = "form-control form-control-custom-50" }) 
</div> 

<div class="form-group-sm"> 
    @Html.LabelFor(m => m.HIVTestCD4Count, new { @class = "control-label" }) 
    @Html.EditorFor(m => m.HIVTestCD4Count, new { htmlAttributes = new { @class = "form-control form-control-custom-50" } }) 
</div> 

<input type="button" value="Add" id="btnAddNewTest" class="btn btn-info" /> 
<input type="button" value="Cancel" id="btnCancelAdd" class="btn btn-danger" /> 

Вот мой Аякса вызов:

$('#btnAddNewTest').on("click", function() { 
     var date = $('#HIVTestTestDate').val(); 
     var result = $('#HIVTestTestResult').val(); 
     var cd4 = $('#HIVTestCD4Count').val(); 
     var pID = $('#PatientID').val(); 

     var dataToSend = { patientID: pID, testDate: date, resultID: result, cd4Count: cd4 }; 

     $.ajax({ 
      url: '/HIVInformation/AddHIVTest/', 
      type: 'post', 
      data: dataToSend, 
      success: function (partialViewReceived) { 
       $('#HIVTestCollection').html(partialViewReceived); 
      } 
     }); 
    }); 

Здесь действие в контроллере вызывается при вызове Ajax:

public PartialViewResult AddHIVTest(Guid patientID, DateTime testDate, Guid resultID, int cd4Count) 
     { 
      MvcPatientDetailsHIVViewModel model = new MvcPatientDetailsHIVViewModel(patientID); 
      model.LoadAllData(); 

      try 
      { 
       //add the HIV Test 
       model.HIVTestResult = new Common.Models.PatientHIVTestModel() 
       { 
        ID = Guid.NewGuid(), 
        PatientID = patientID, 
        TestDate = testDate, 
        HIVTestResultID = resultID, 
        CD4Count = cd4Count 
       }; 

       //call the add method 
       model.AddHIVTestResults(); 
      } 
      catch (Exception ex) 
      { 
       ModelState.AddModelError("", ex); 
      } 

      return PartialView("_HIVTestCollection", model); 
     } 

Это неполный просмотр, загруженный после успешной/безуспешной попытки чтобы добавить новый тест на ВИЧ.

@model EDR.Presentation.WebMain.ViewModels.MvcPatientDetailsHIVViewModel 
@using EDR.Presentation.WebMain.Helpers 

@if (Model.PatientHIVTestCollection != null && Model.PatientHIVTestCollection.Count > 0) 
{ 
    <div class="table-responsive"> 
     <table class="table table-hover"> 
      <thead> 
       <tr> 
        <th>Date</th> 
        <th>Test Result</th> 
        <th>CD4 Count</th> 
        <th>Actions</th> 
       </tr> 
      </thead> 
      <tbody> 
       @foreach (var hivTest in Model.PatientHIVTestCollection.OrderByDescending((x) => x.TestDate)) 
       { 
        <tr> 
         <td>@RazorHelper.ToDateString(() => hivTest.TestDate)</td> 
         <td>@RazorHelper.ToString(() => hivTest.HIVTestResult.DisplayName)</td> 
         <td>@RazorHelper.ToString(() => hivTest.CD4Count)</td> 
         <td> 
          @Ajax.ActionLink("Edit", "EditHIVTest", new { patientID = Model.PatientID, testID = hivTest.ID }, new AjaxOptions() { HttpMethod = "get", InsertionMode = InsertionMode.Replace, UpdateTargetId = "testEdit" }, new { @class = "btn btn-info" }) 
          @Ajax.ActionLink("Delete", "DeleteHIVTest", new { patientID = Model.PatientID, testID = hivTest.ID }, new AjaxOptions() { HttpMethod = "get", InsertionMode = InsertionMode.Replace, UpdateTargetId = "HIVTestCollection" }, new { @class = "btn btn-danger" }) 
         </td> 
        </tr> 
       } 
      </tbody> 
     </table> 
    </div> 
} 
else 
{ 
    <text>No Data to display</text> 
} 

Я проверил после исключения исключения, что сообщение проверки добавлено в ModelState.

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

См. Также частичный вид, отображаемый на основном экране для отображения валидационных сообщений.

@model ModelStateDictionary 

@if (!Model.IsValid) 
{ 
    <div class="panel panel-danger"> 
     <div class="panel-heading">Validation Errors</div> 
     <div class="panel-body"> 
      <ul> 
       @foreach (var modelError in 
          Model.SelectMany(keyValuePair => keyValuePair.Value.Errors)) 
       { 
        <li>@modelError.ErrorMessage</li> 
       } 
      </ul> 
     </div> 
    </div> 
} 

Любая помощь была бы принята с благодарностью.

Answer 1

В вашем методе контроллера AddHIVTest() есть небольшая точка с добавлением ошибки ModelState. Они предназначены для использования в помощниках ValidationSummary() и ValidationMessageFor(), связанных с формой, но связанный с ними частичный не имеет формы. Вместо этого вы можете просто добавить сообщение об ошибке в модели представления или ViewBag собственности, например

catch (Exception ex) 
{ 
    ViewBag.ErrorMessage = ex.ToString(); 
} 

, которые вы можете сделать в этом _HIVTestCollection частичное как (скажем)

<div id="errormessage">@ViewBag.ErrorMessage</div> 

Затем, если вы хотите для отображения этого сообщения в другом месте в главном представлении, чем где вы выполняете частичное, измените функцию ajax, чтобы переместить <div> в новое место. Если предположить, что основной вид содержит элемент

<div id="errorcontainer"><div> // placeholder for the error message 
.... // other elements 
<div id="HIVTestCollection"><div> // placeholder for the partial 

Затем

$.ajax({ 
    url: '/HIVInformation/AddHIVTest/', 
    type: 'post', 
    data: dataToSend, 
    success: function (partialViewReceived) { 
     $('#HIVTestCollection').html(partialViewReceived); 
     $('#errorcontainer').append($('#errormessage')); // move the message from the partial to the placeholder in the main view 
    } 
}); 

Другим вариантом было бы генерировать 2 частичный вид (одна с ошибками), и возвращает их в виде строки (в JsonResult) с использованием метода описанный в this answer.