2014-09-08 4 views
0

У меня есть контейнер, который я заполняю из вызова ajax, который возвращает PartialView списка. У меня есть 2 вызова: CreateSplitInput и RemoveSplit.MVC-просмотр не обновляется должным образом после вызова jquery ajax

Вызов контроллера, похоже, сработает, и модель передана на частичный вид с правильным дочерним списком. Во время отладки казалось бы, что представление вернет правильный html.

Добавление новых входов У меня нет проблем ... удаление элемента ввода только «всплывает» по последнему элементу списка.


ОБНОВЛЕНИЕ: MVC сначала проверит ModelState, затем модель. Мне нужно было добавить ModelState.Clear() в мой метод контроллера RemoveSplit.

Кредит awrigley MVC 3 + $.ajax - response seems to be caching output from partial view


ТИА !!!

Модель:

public class Split 
{ 
    public int SplitID { get; set; } 
    public int ClientProfileID { get; set; } 
    public int CoveredPersonID { get; set; } 
    public DateTime StartDate { get; set; } 
    public DateTime? EndDate { get; set; } 

    public virtual List<SplitPercent> Percentages { get; set; } 
} 

public class SplitPercent 
{ 
    public int SplitPercentID { get; set; } 
    public int SplitID { get; set; } 
    public string PremiumKeyField { get; set; } 
    public decimal Percentage { get; set; } 
} 

Контроллер:

public ActionResult CreateSplitInput(Split model) 
    { 
     if (model.Percentages == null) 
      model.Percentages = new System.Collections.Generic.List<SplitPercent>(); 
     model.Percentages.Add(new SplitPercent()); 
     return PartialView("~/views/clients/_SplitPercentages.cshtml", model); 
    } 

public ActionResult RemoveSplit(Split model, int index) 
    { 
     ModelState.Clear(); // <== HERE IS THE ANSWER!!!!! 
     if (model.Percentages != null && model.Percentages.Count >= (index + 1)) 
     { 
      model.Percentages.RemoveAt(index); 
     } 
     return PartialView("~/views/clients/_SplitPercentages.cshtml", model); 
    } 

Javascrpt:

function addSplit() { 
     if (true) { // testing purposes 
      $.ajax({ 
       url: '/clients/CreateSplitInput', 
       data: $("#frm").serialize(), 
       cache: false, 
       success: function(resp) { 
        setSplitContainer(resp); 
       }, 
       error: function(err, status) { 
        alert(status); 
       } 
      }); 
     } 
    } 

function removeSplit(indx) { 
     if (true) { // testing purposes 
      $.ajax({ 
       url: '/clients/RemoveSplit/?index=' + indx, 
       data: $("#frm").serialize(), 
       cache: false, 
       type: 'GET', 
       success: function(resp) { 
        //debugger; 
        setSplitContainer(resp); //<-- the resp html just has the last item popped off 
       }, 
       error: function(err, status) { 
        alert(status); 
       } 
      }) 
     }   
    } 

function setSplitContainer(h) { 
     $("#splitPercents").html(h); 
     $("select").chosen(chosenOpts); 
    } 

_SplitPercentages.cshtml PartialView: Отладочное это показывает коллекцию правильных ПРОЦЕНТОВ ... кажется правильно связывать ,

@model BillingWeb.Models.Split 


@if (Model != null && Model.Percentages != null) 
{ 
    var logic = new ClientLogic(); 
    var premiumKeys = logic.GetAllPremiumKeyFields(Model.ClientProfileID); 
    string test = ""; 

    int index = 0; 
    foreach (var percent in Model.Percentages) 
    { 
     test += ", " + percent.PremiumKeyField; // <- collect the model data to show at the end 
     var selectList = new SelectList(premiumKeys, percent.PremiumKeyField); // Trying anything now... 

     <div class="form-group"> 
      @Html.Hidden("Percentages.Index", index) 
      @Html.Hidden(string.Format("Percentages[{0}].SplitID", index), percent.SplitID) 

      <div class="col-md-5 col-lg-5"> 
       @Html.DropDownListFor(m => m.Percentages[index].PremiumKeyField, selectList, new { @class = "form-control" }) 
      </div> 
      <div class="col-md-4 col-lg-4"> 
       <div class="input-group"> 
        <span class="input-group-addon">%</span> 
        @Html.TextBoxFor(m => m.Percentages[index].Percentage, new { @class = "form-control text-right", placeholder = "Split %" }) 
        <button type="button" class="btn btn-danger input-group-addon" onclick="removeSplit(@index)"> 
         <span class="glyphicon glyphicon-remove"></span> 
        </button> 
       </div> 
      </div> 
     </div> 

     index++; 
    } 
    <p>@test</p> <!-- WTH?! this works? --> 
} 

Главный Вид:

@model BillingWeb.Models.Split 

    <div class="form-group"> 
     <label class="control-label col-md-2">Percentages</label> 
     <div class="col-md-8"> 
      <div id="splitPercents"> 
       @Html.Partial("~/Views/Clients/_SplitPercentages.cshtml", Model) 
      </div> 
      <button type="button" class="btn btn-primary" onclick="addSplit()">Add Split</button> 
     </div> 
    </div> 
+0

Wheres Функция splitPercents? Вы загружаете HTML внутри div splitPercents? – Fals

+0

Разделение splitPercents первоначально загружается через @ Html.Partial. Пользователь может динамически добавлять/удалять входные строки через ajax с помощью addSplit() и removeSplit(). Вызов removeSplit() - это проблема. –

+0

Вы должны добавить результат с сервера внутри div splitPercents. – Fals

ответ

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