Получение данных из JSON в текстовые поля в диалоговом окне пользовательского интерфейса jQuery

Question

Я постараюсь как можно больше объяснить мою ситуацию здесь. Поскольку это проблема, связанная с работой, у меня не так много кода для показа.

Я работаю с диалогом jQuery. Сценарий: у меня есть список некоторых имен, например, &. Перед каждым именем выпадающее окно загрузочного окна. Чтобы быть более конкретным, я пытаюсь создать окно редактирования, посредством которого пользователь может редактировать запись. Имена поступают из JSON, извлеченного из базы данных на основе PHP.

Мы все знаем, что мы можем легко получить данные &, используя $.get. В том же блоке, я написал код для JQuery UI Dialog, как это,

//document.ready block 
$.get("ajax/test.html", function(data) { 
    $(".result").html(data); 
$("#btn-edit").on('click', function(){ 
    $("#dialog").dialog({ 
     open: function(){ 

     $('#some_textbox').val(data.name); //textbox is in the dialog 
     } 
    }); 
}); 
}); 

<div id="dialog" title="Basic dialog"> 
<p>This is the default dialog which is useful for displaying information. The dialog window can be moved, resized and closed with the 'x' icon.</p> 
</div> 

Вопрос заключается в том, что значение текстового поля не получал установлен data.name тогда я мог бы совершенно console.log(data); в этом блоке. Я тоже смог установить некоторую случайную строку, $('#some_textbox').val("some random string");.

Почему?

Так что мой наставник, как супервайзер, сказал мне, что он должен что-то сделать с привязками. Это правда? Как я могу это решить?

Answer 1

Проблема в том, что вы получаете строку обратно, которая, возможно, действительна json, но которая еще не обрабатывается. Вы могли бы разобрать результат, но проще было бы изменить $.get:

$.getJSON("ajax/test.html", function(data) { 

Answer 2

Это пример JSON файла: (producten.json)

[ 
{"model":"SAMSUNG", "price":"1000", "omschrijving":"Dit is een groot teveetje", "scherm":"1000", "label":"A++", "wifi":"Ja, ingebouwd"}, 
{"model":"SONY", "price":"2000", "omschrijving":"Dit is een nog groter teveetje", "scherm":"2000", "label":"A+", "wifi":"Ja, met dongle (optie)"} 
] 

Это как вы запрашиваете вещи из него и ввести его в HTML:

$(document).ready(function() { 
// get JSON data from producten.json 
console.log("Jquery triggered"); 
$.getJSON('producten.json', function(data) { 
    console.log("getJSON triggered"); 
    var i = 0; 
    var bool = true; 
    while(bool) { 
     console.log(data[i].model); 
    var model = data[i].model; 
    var price = data[i].price; 
    var omschrijving = data[i].omschrijving; 
    var scherm = data[i].scherm; 
    var label = data[i].label; 
    var wifi = data[i].wifi; 
    i++; 
      //add artikel by JSON 
     var artikel = "<article><h3>" + model + "</h3><ul><li><img alt='" + model + "' src='images/tv-icon.png'><span>" + price + " EUR</span></li><li>" + omschrijving + "</li><li><ul class='product-details'><li class='diagonal'>Scherm diagonaal: <span>" + scherm + " cm</span></li><li class='energy-label'>Energie label: <span>" + label + "</span></li><li class='wi-fi'>Wi-Fi <span>" + wifi + "</span></li></ul></li></ul></article>"; 
     $("section:eq(1)").append(artikel); 
     console.log("Article added to page by JSON"); 
    } 
    console.log("data JSON obtained"); 
}); 

Извините за дерьмовый во время цикла, это почти кровать время хехе ^^