как получить доступ и вывести результаты json из обратного вызова $ .ajax ()

Question

Я использую Coldfusion и JQuery. Это мой первый настоящий опыт в jquery, и я долго искал и читал, не взломав этого, поэтому любая помощь будет принята с благодарностью ...

Хорошо, у меня есть автозаполнение, возвращающее идентификатор. Затем я передаю идентификатор второй функции, которая возвращает массив данных типа JSON. Автозаполнение прекрасно работает, и я могу заставить json отображаться в окне предупреждения, но я немного застрял в том, как использовать результаты json.

Я пытаюсь перебрать массив json и записать значения в переключатели, которые затем динамически отображаются на странице ... Так что вся идея в этом.

1. пользователь выбирается из выпадающего списка и возвращается идентификатор
2. идентификатор пользователя из выбора передается в функцию пользовательских параметров, а пользовательские параметры возвращаются в json arrary.
3. Перебирается массив json, и на каждой итерации создается радиокнопка с соответствующими значениями.
4. все переключатели выводятся на экран для доступа и выбора.

Код, который у меня пока есть, таков:

<script type="text/javascript">
 // <!--
 $(document).ready(function() {
    $("#userName").autocomplete({
        cache:false,
        source: "/jqueryui/com/autocomplete.cfc?method=getUser&returnformat=json",
        //setup hidden fields
        select:function(event,ui) {
            var uid = ui.item.id;
            $("#userid").val(ui.item.id);


            // start call to get user options
             $.ajax({
                 type: "POST",
                 url: "/jqueryui/com/autocomplete.cfc?method=getUserOptions&returnformat=json",
                 data: ({ userid: uid }),
                 success: function(data) {              
                    alert(data)
                    }
                 });
            /// end call to get user options
        }
    });
});
// --->

</script>

json, отображаемый во всплывающем окне «alert (data)», которое выглядит хорошо, выглядит так:

[{"productname":"licence free","quantity":1,"term":12,"id":1},
{"productname":"licence basic","quantity":1,"term":24,"id":1},
{"productname":"licence full","quantity":1,"term":12,"id":2}]

Мне нужно знать, как перебирать эти данные и создавать переключатели для каждой опции, возможно, что-то вроде этого, и отображать их все на экране, что, я думаю, я просто напишу через dom один раз Мне есть что написать:

<input type="radio" name="userOption" value="#id#|#qty#|#term#">#productname#

Я попробовал несколько вещей, но безуспешно, например:

for(var i =0;i<Data.length-1;i++) 
{ 
  var item = Data[i]; 
  alert(item.productname + item.id); 
} 

и

$.each(data.items, function(i,item){      
    alert(item);      
    if ( i == 3 ) return false;    
    });

Я не мог заставить ни одного из них работать.

Во всяком случае, это немного затянуто. Надеюсь, что это понятно, и снова любая помощь или предложения приветствуются.

Спасибо!

Answer 1

Сначала проверьте тип данных возвращаемого параметра data. Сначала вам может понадобиться использовать .parseJSON() для создания объекта JSON.

Тогда ваш синтаксис цикла for неверен. у меня этот код работает:

var data = [{"productname":"licence free","quantity":1,"term":12,"id":1},
            {"productname":"licence basic","quantity":1,"term":24,"id":1},  
            {"productname":"licence full","quantity":1,"term":12,"id":2}];

for (var i=0; i<data.length; i++) {
    alert(data[i].productname);
}

Вот вам jsfiddle

Answer 2

Используйте каждый цикл для получения данных и функцию appendTo для печати данных в элементе HTML с id1 результата:

dataType:"json", //nature of returned data
success: function(data) {
    var  content = ''; 

    $.each(data, function(i, dbdata) {
        content += '<p>' + dbdata.columnName + '<p>';
    });

    $(content).appendTo("#result1");
}

Answer 3

Я уверен, что тип является строкой? Если это так, попробуйте это с помощью функции javascript eval. Он преобразует строку в тип javascript .. в вашем случае что-то вроде этого должно работать:

Var new_data = eval(data);

Теперь это должен быть работающий массив / объект

Редактировать: остаться с переменной данных:

data = eval(data);

Редактировать 2:

В вашем вызове ajax отсутствует свойство dataType:

dataType: "json"

С этим вам не понадобится то, что я сказал выше

Answer 4

Попробуйте проверить parseJSON Функция jquery.