У меня есть представление со следующим кодом, обертывающим тег формы:
<select name="@SchoolSystemMVCRazor.Models.Miscellaneous.Helpers.RazorHelper.ReportCardSubjectSequence.Selector1" id="@SchoolSystemMVCRazor.Models.Miscellaneous.Helpers.RazorHelper.ReportCardSubjectSequence.Selector1" multiple="multiple" style="width: 300px;height: 100px">
@foreach (SchoolSystemMVCRazor.Models.General.Subject subject in leftSubjects)
{
<option value="@subject.SubjectId">@subject.DisplayName</option>
}
</select>
<input type="button" style="width: 300px" id="toRight" value=">" />
<select name="@SchoolSystemMVCRazor.Models.Miscellaneous.Helpers.RazorHelper.ReportCardSubjectSequence.Selector2" id="@SchoolSystemMVCRazor.Models.Miscellaneous.Helpers.RazorHelper.ReportCardSubjectSequence.Selector2" multiple="multiple" style="width: 300px;height: 100px">
@foreach (SchoolSystemMVCRazor.Models.General.Subject subject in rightSortedSubjects)
{
<option value="@subject.SubjectId">@subject.DisplayName</option>
}
</select>
<input type="button" style="width: 300px" id="toLeft" value="<" />
<script>
$(function() {
function moveItems(origin, destination) {
$(origin).find(':selected').appendTo(destination);
}
$('#toLeft').on('click', function() {
moveItems('#@SchoolSystemMVCRazor.Models.Miscellaneous.Helpers.RazorHelper.ReportCardSubjectSequence.Selector2', '#@SchoolSystemMVCRazor.Models.Miscellaneous.Helpers.RazorHelper.ReportCardSubjectSequence.Selector1');
});
$('#toRight').on('click', function() {
moveItems('#@SchoolSystemMVCRazor.Models.Miscellaneous.Helpers.RazorHelper.ReportCardSubjectSequence.Selector1', '#@SchoolSystemMVCRazor.Models.Miscellaneous.Helpers.RazorHelper.ReportCardSubjectSequence.Selector2');
});
$('#toLeftAll').on('click', function() {
moveAllItems('#@SchoolSystemMVCRazor.Models.Miscellaneous.Helpers.RazorHelper.ReportCardSubjectSequence.Selector2', '#@SchoolSystemMVCRazor.Models.Miscellaneous.Helpers.RazorHelper.ReportCardSubjectSequence.Selector1');
});
$('#toRightAll').on('click', function() {
moveAllItems('#@SchoolSystemMVCRazor.Models.Miscellaneous.Helpers.RazorHelper.ReportCardSubjectSequence.Selector1', '#@SchoolSystemMVCRazor.Models.Miscellaneous.Helpers.RazorHelper.ReportCardSubjectSequence.Selector2');
});
});
</script>
Вид компонента
Кажется, все работает, пока я не сделаю что-то вроде щелчка по элементу селектора 2 (справа) и перемещения его влево. Теперь formCollection в моем C # скрипте только захватывает selector1. Значение selector2 важно для меня, потому что мне нужно извлечь выбранные пользователем значения в selector2 в порядке их добавления.
Отладка только для селектора выбора1
Интересно, что я сделал неправильно с точки зрения кодирования, в результате чего селектор 2 не был захвачен в formCollection? Любой специалист по javaScript или C # может помочь, так как я не знаю, что пошло не так, как я новичок в веб-разработке?