MVC Partial View Not Refreshing when using JSON data
- by 40-Love
I have a dropdown that I'm using to refresh a div with checkboxes.
I am trying to figure out why my view is not refreshing if I pass in data in JSON format. If I pass in just a regular string, the view refreshes.
If I pass in JSON data, the view does not refresh.
If I step through the code in the Partial view, I can see the correct number of records are being passed in, however the view doesn't get refreshed with the correct number of checkboxes.
I tried to add some cache directives, it didn't work.
This doesn't work:
$(function () {
$('#ddlMoveToListNames').change(function () {
var item = $(this).val();
var selectedListID = $('#ddlListNames').val();
var checkValues = $('input[name=c]:checked').map(function () {
return $(this).val();
}).toArray();
$.ajax({
url: '@Url.Action("Test1", "WordList")',
type: 'POST',
cache: false,
data: JSON.stringify({ words: checkValues, moveToListID: item, selectedListID: selectedListID }),
dataType: 'json',
contentType: 'application/json; charset=utf-8',
success: function (result) {
}
})
.done(function (partialViewResult) {
$("#divCheckBoxes").replaceWith(partialViewResult);
});
});
});
This works:
$(function () {
$('#ddlMoveToListNames').change(function () {
var item = $(this).val();
var selectedListID = $('#ddlListNames').val();
var checkValues = $('input[name=c]:checked').map(function () {
return $(this).val();
}).toArray();
$.ajax({
url: '@Url.Action("Test1", "WordList")',
type: 'POST',
cache: false,
data: { selectedListID: item },
success: function (result) {
}
})
.done(function (partialViewResult) {
$("#divCheckBoxes").replaceWith(partialViewResult);
});
});
});
Partial View:
@model WLWeb.Models.MyModel
<div id="divCheckBoxes">
@foreach (var item in Model.vwWordList)
{
@Html.Raw("<label><input type='checkbox' value='" + @Html.DisplayFor(modelItem => item.Word) + "' name='c'> " + @Html.DisplayFor(modelItem => item.Word) + "</label> ");
}
</div>
Controller:
[AcceptVerbs(HttpVerbs.Post)]
[OutputCache(NoStore = true, Duration = 0, VaryByParam = "*")]
public PartialViewResult Test1(MyModel vm, string[] words, string moveToListID, string selectedListID)
{
int listNameID = Convert.ToInt32(moveToListID);
List<vwWordList> lst = db.vwWordLists.Where(s => s.Word.StartsWith("wa") && s.ListID == listNameID).ToList();
vm.vwWordList = lst;
return PartialView("Partial1", vm);
}
View:
@Html.DropDownListFor(x => Model.FilterViewModel.MoveToListNameID, Model.FilterViewModel.MoveToListNameList,
new { @id = "ddlMoveToListNames", style = "width:100px;" })