Выполнить раскрывающееся меню с данными json

78
12

Я пытаюсь заполнить dropdownbox данными со страницы JSON.

Вот код, который я использую:

<script type="text/javascript" charset="utf-8">
$(document).ready(function () {
$.ajax({
url: "json/wcf.svc/GetTax",
dataType: 'json',
data: data
});

$($.parseJSON(data.msg)).map(function () {
return $('<option>').val(this.value).text(this.label);
}).appendTo('#taxList');
});
</script>

И вот что возвращает данные json:

{"d":"{\"16\":\"hello\",\"17\":\"world\"}"}

Я получаю сообщение об ошибке "данные не определены". Должен ли я как-то сказать JQ, как читать данные json?

спросил(а) 2021-01-25T11:36:37+03:00 4 месяца, 3 недели назад
1
Решение
99

Во-первых, переменная данных, которую вы передаете на вызов ajax, не определена (ну, а не в примере кода, который вы указали), а во-вторых, вызов ajax происходит асинхронно, поэтому вам нужно что-то сделать с возвращенными данными, то есть через успешный обратный вызов. Пример:

$(document).ready(function () {
var data = //define here
$.ajax({
url: "json/wcf.svc/GetTax",
dataType: 'json',
data: data, // pass it in here
success: function(data)
{
$(data.msg).map(function () {
return $('<option>').val(this.value).text(this.label);
}).appendTo('#taxList');
}
});
});

также вам не нужно анализировать данные, возвращаемые с помощью вызова ajax, поскольку jQuery будет автоматически анализировать JSON для вас (должен понадобиться $.parseJSON(data.msg))

РЕДАКТИРОВАТЬ

Основываясь на интересном формате JSON и предполагая, что он не может быть изменен, это должно работать (уродливо, хотя)

$(document).ready(function () {
var data = //define here
$.ajax({
url: "json/wcf.svc/GetTax",
dataType: 'json',
data: data, // pass it in here
success: function(data)
{
data = data.d.replace(/{/g, '').replace(/}/g, '').split(',');
var obj = [];
for (var i = 0; i < data.length; i++) {
obj[i] = {
value: data[i].split(':')[0].replace(/"/g, '').replace('\\', ''),
label: data[i].split(':')[1].replace(/"/g, '')
};
}
var htmlToAppend = "";
for (var j = 0; j < obj.length; j++) {
htmlToAppend += '<option value="' +
obj[j].value +
'">' + obj[j].label +
'</option>';
}
$('#taxList').append(htmlToAppend);
}
});
});

ответил(а) 2021-01-25T11:36:37+03:00 4 месяца, 3 недели назад
63

Для возврата данных вам необходимо использовать опцию success.


<script type="text/javascript" charset="utf-8">
$(document).ready(function () {
$.ajax({
url: "json/wcf.svc/GetTax",
dataType: 'json',
success: function(data){

$(data.msg).map(function () {
return $('<option>').val(this.value).text(this.label);
}).appendTo('#taxList');

}
});

});
</script>

ответил(а) 2021-01-25T11:36:37+03:00 4 месяца, 3 недели назад
Ваш ответ
Введите минимум 50 символов
Чтобы , пожалуйста,
Выберите тему жалобы:

Другая проблема