#javascript #asp.net-mvc #twitter-bootstrap
#javascript #asp.net-mvc #twitter-bootstrap
Вопрос:
Я пытаюсь заполнить строку списка массива, чтобы затем я мог заполнить свои выпадающие списки.
Я передаю ему строку массива и настраиваю свой список массивов следующим образом:
var thirdParties = [{'7-Eleven', '114'},{'A Mart All Sports', '41'},{'A.J Coory Dental', '140'}];
Затем я пытаюсь заполнить свои выпадающие списки следующим образом:
if (id == 1) // Payment
{
//alert('Payment');
$('#SourceEntityId').empty();
$.each(accounts, function (val, text) {
$('#SourceEntityId').append($('<option></option>').val(val).html(text));
});
$('#DestinationEntityId').empty();
$.each(thirdParties, function (val, text) {
$('#DestinationEntityId').append($('<option></option>').val(val).html(text));
});
}
if (id == 2) // deposit
{
//alert('Deposit');
$('#SourceEntityId').empty();
$.each(thirdParties, function (val, text) {
$('#SourceEntityId').append($('<option></option>').val(val).html(text));
});
$('#DestinationEntityId').empty();
$.each(accounts, function (val, text) {
$('#DestinationEntityId').append($('<option></option>').val(val).html(text));
});
}
Однако в выпадающем списке нет элементов. Возможно ли то, что я делаю?
Ответ №1:
Ваш объект внутри массива был неправильным.
var thirdParties = [{
text: '7-Eleven',
value: '114'
}, {
text: 'A Mart All Sports',
value: '41'
}, {
text: 'A.J Coory Dental',
value: '140'
}];
$('#SourceEntityId').empty();
$.each(thirdParties, function () {
console.log(this);
var thirdParty = this;
$('#SourceEntityId').append($('<option></option>')
.val(thirdParty.value).html(thirdParty.text));
});
ИЛИ другой способ — ДЕМО
var thirdParties = [['7-Eleven','114'],['A Mart All Sports','41'],['A.J Coory Dental','140']];
$('#SourceEntityId').empty();
$.each(thirdParties, function () {
var thirdParty = this;
console.log(thirdParty[1]);
$('#SourceEntityId').append($('<option></option>')
.val(thirdParty[1]).html(thirdParty[0]));
});
Комментарии:
1. Идеально! Спасибо! Выбрал 2-й вариант, чтобы мой массив был меньше (меньше текста, из-за меньшего количества повторяющихся имен каждого «поля». Спасибо.
Ответ №2:
Здесь у вас две проблемы:
1. Ваш массив недействителен:
[{'7-Eleven', '114'},{'A Mart All Sports', '41'},{'A.J Coory Dental', '140'}];
То, что у вас здесь есть, — это массив, содержащий недопустимые объекты.
Если вам нужен массив массивов, он должен выглядеть следующим образом:
[['7-Eleven', '114'],['A Mart All Sports', '41'],['A.J Coory Dental', '140']];
Если вам нужен действительный массив объектов, вам необходимо предоставить ключевые свойства.Что — то вроде этого:
[{text:'7-Eleven', value:'114'},{text:'A Mart All Sports', value:'41'},{text:'A.J Coory Dental', value:'140'}];
2. обратный вызов каждого jquery не выполняется, valtext
но indexobject
:
$.each(accounts, function (idx, obj) {});
и поэтому, если мы используем допустимый массив, то:
var arr = [{text:'7-Eleven', value:'114'},{text:'A Mart All Sports', value:'41'},{text:'A.J Coory Dental', value:'140'}];
$.each(arr, function (idx, obj) {
$('#SourceEntityId').append($('<option></option>').val(obj.value).html(obj.text));
});
Вот скрипка.
Ответ №3:
Когда вы выполняете .html (), который очищает элемент и вводит переменную. Вы хотели бы использовать .append() …
По сути, каждый раз, когда он проходит через этот цикл, он сбрасывает контейнер.
Другое дело, что вы можете динамически создавать неупорядоченный список и добавлять список таким образом, и просто иметь теги данных для хранения значений. Это даст вам больше возможностей для игры со стилем и анимацией.
var list_container = $("<ul/>").addClass ('list');
$('whatever container you decide this is going into').append(list_container);
$.each(thirdparties, function (index){
var li = $("<li/>").addClass('classname').attr('data-value',thirdparties[index].value);
$('.list').append(li);
$('li[data-value="' thirdparties[index].value '"]).html(thirdparties [index].text);
});
Это просто что-то очень быстрое, я делаю это со своего телефона. Я бы подключил его к jsfiddle и попробовал.