запутался, как правильно использовать jquery getJSON
Я пытаюсь использовать jquery getJSON получить информацию для моей таблицы из файла php, и это не работает. Может ли кто - нибудь дать мне несколько советов о том, где я иду неправильно:
Javascript:
$(document).ready(function(){
$("input#autofill").click(function()
{
$.get("last_year_ISBN.php",
function(data){
var isbns = $.parseJSON(data); //creates a javascript object.
$.each(isbns, function(){
var elements = document.getElementById("booklist").getElementsByTagName("input");
for (var i=0, i<elements.length; i++)
{
elements[i] = this;
}
});
},
"json");
});
});
HTML / php
<?php
$file = fopen("SGS_Fall_Booklist.csv", "r");
$entry= fgetcsv($file);
echo $entry[0] . $_GET["program"] . $entry[1] . $GET["school"] . $entry[2] . $GET["term"] . "<br>";
//COMMENTED OUT FOR TESTINGecho "<input type='submit' name='checkall' value='AutoFill (last years ISBN's)'></input><br>";
//if ($entry[0] == $_GET["program"] && $entry[1] ==$GET["school"] && $entry[2] == $GET["term"])
//{
echo "<table id='booklist'><tr>
<th>Edit</th>
<th class='coursename'>" . $entry[6] . "</th>
<th class='startdate'>" . $entry[7] . "</th>
<th class='booktitle'>" . $entry[17]. "</th>
<th class='author'>" . $entry[18]. "</th>
<th class='isbn'>" . $entry[16]. "</th>
</tr>";
while(! feof($file))
{
$entry = fgetcsv($file);
echo "<tr>
<td><input type='checkbox'></input></td>
<td class='coursename'>" . $entry[6] . "</td>
<td class='startdate'>" . $entry[7] . "</td>
<td class='booktitle'>" . $entry[17]. "</td>
<td class='author'>" . $entry[18]. "</td>
<td class='isbn'><input class='ISBN_number' type='text' value='";
if(isset($_GET["checkall"]))
{
echo $entry[16];
}
echo "'size='13' maxlength='13'></input></td>
</tr>";
}
//}
echo "</table>";
fclose($file);
?>
Внешний php-файл
<?php
$file = fopen("SGS_Fall_Booklist.csv", "r");
$entry = fgetcsv($file); //discard the first title line
$i=0;
while(! feof($file))
{
$entry = fgetcsv($file);
$isbns=[$i] = $entry;
$i++;
}
fclose($file);
echo json_encode($isbns);
?>
Я изменил свой код, как предложил hyperslug, и он по-прежнему не работает. Предупреждение (данные)возвращает всю инструкцию json. Чего мне не хватает?
$(document).ready(function(){
$("input#autofill").click(function()
{
$.get("last_year_ISBN.php",
function(data){
alert(data);
var isbns = $.parseJSON(data); //creates a javascript object.
var elements = $('#booklist .ISBN_number');
$.each(isbns, function(index, obj){
//var elements = document.getElementById("booklist").getElementsByTagName("input");
//for (var i=0, i<elements.length; i++)
//{
//elements[i].value = this;
//}
$(elements[index]).val(obj);
});
},
"json");
});
});
Я наконец-то разобрался со своим проблема! Я использую json_encode в PHP, который отправляет запрос обратно в виде JSON. То.get call считывал его как JSON (обратите внимание на последний параметр) и автоматически превращал в объект javascript. Поэтому, конечно, моя строка parseJSON не будет работать, я разбирал объект javascript, а не текст json!!
5 ответов:
Ваш цикл jQuery
.each
дает вам индекс и ссылку на каждый объект вisbns
. Еслиisbns
является простым массивом и имеет точно такое же количество элементов, как вашbooklist
имеет строки,var elements = $('#booklist .ISBN_number'); $.each(isbns, function(index, obj){ $(elements[index]).val(obj); });
Следует заполнить поля ISBN
<input>
.Если
isbns
На самом деле является массивом объектов, вам придется ссылаться на это значение по имени:$(elements[index]).val(obj.ISBN);
Я не знаю, Единственная ли это проблема, но я вижу две проблемы со следующим кодом, согласно комментариям, которые я добавил в код, и объяснению ниже:
$.get("last_year_ISBN.php", function(data){ alert(data); // <--- NEW DEBUGGING ALERT HERE var isbns = $.parseJSON(data); //creates a javascript object. $.each(isbns, function(){ var elements = document.getElementById("booklist").getElementsByTagName("input"); // PROBLEM: you're setting all input elements to the current item // from the $.each for (var i=0, i<elements.length; i++) { elements[i] = this; // <--- SHOULD BE elements[i].value = this } }); }, "json" );
Я предполагаю, что вы намерены обновить входные данные HTML для отображения данных из вашего JSON. Для этого вам нужно сказать
elements[i].value = this
, или, с помощью jQuery,$(elements[i]).val(this)
.Ваш цикл
$.each
перебирает все элементы из вашего JSON, но для каждого элемента вы затем запускаете один и тот же циклfor
и обновляете все входные данные в "booklist" для текущего элемента.Я бы предложил сначала ввести отладочный оператор
console.log(data)
илиalert(data)
, чтобы подтвердить, что ваш обратный вызов действительно вызывается и какие данные он получает. (Я добавил Это выше.)Затем, чтобы решить проблему (2), вам нужно назначить отдельные входные данные соответствующим значениям из вашего JSON, но я не могу действительно предложить, как это сделать, не видя структуру JSON.
Правка: только что видел ответ гиперслуга - это то, о чем я говорил с проблемой (2). Предположим, что ваш JSON-это простой массив с элементами, которые соответствуют один к одному вашим входам, которые должны работать идеально. Если ваш JSON более сложный, пожалуйста, обновите свой вопрос, чтобы показать его формат.
Ваш PHP может использовать небольшое улучшение:
$isbns = array(); while ($line = fgetcsv($file)) { $isbns[] = $line; } echo json_encode($isbns);
Однако, почему вы используете AJAX-вызов для заполнения html-формы, используя те же исходные данные, что и PHP-скрипт, который сгенерировал форму в первую очередь?