Добрый день!
На странице есть список (ul) с элементами li = checkbox + label + hidden (id). Также есть checkbox, который должен фильтровать элементы списка:
@Html.CheckboxFor(m=>m.Filter)
<ul>
@for (int i = 0; i < Model.Data.Count(); i++)
{
<li>
@Html.HiddenFor(m=>m.Data[i].Id)
@Html.CheckBoxFor(m=>m.Data[i].Checked)
@Html.DisplayFor(m=>m.Data[i].Name)
</li>
}
</ul>
Фильтрация списка будет происходить без перегрузки страницы. Добавляю скрипт, в котором через jquery ajax обновляю элементы списка по клику на checkbox
$.ajax({
url: '/Controller/GetData',
dataType: 'json',
traditional: true,
data: { filter: checked},
success: function(data) {
dataList.empty();
$.each(data, function(index, item) {
var listItem = $('<li></li>');
var hidden= $('<input></input>', {
//init hidden data
'type' : 'hidden'
});
var checkbox = $('<input></input>', {
//init checkbox data
'type' : 'checkbox'
});
var label = $('<span></span>', {
// init label data
});
listItem.append(hidden);
listItem.append(checkbox);
listItem.append(label);
dataList.append(listItem);
});
}
});
По кнопке submit выбранные элементы списка передаются на сервер.
Вопрос: как избежать дублирования кода во вьюхе и скрипте? Имеется в виду в одном месте хранить структуру ul и каждого li.
Спасибо.
