Вход

Просмотр полной версии : Ошибка при чтении json полученного через ajax


ishurgaya
10.12.2018, 02:02
Здравствуйте.

Хочу сделать подгрузку json через ajax, с последующим поиском по json, по :

var json;
var xmlhttp;
var products;

if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp = new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
json = JSON.stringify(xmlhttp.responseText);

json = JSON.parse(json);
}
}
xmlhttp.open("GET","/app/js/lib.json",true);
xmlhttp.send();

function searchPositions(arr, searchKey)
{
return arr.filter(obj => Object.keys(obj).some(key => obj[key].includes(searchKey)));
}

products = searchPositions(json, "текст");


В итоге получаю ошибку в строке return arr.filter(obj => Object.keys(obj).some(key => obj[key].includes(searchKey))); :
main.js:270 Uncaught TypeError: arr.filter is not a function

Причем если json вставить сразу в код, примерно так, то ошибок не будет и поиск отрабатывает:

json = JSON.stringify([{"id":1,"low_name":"белый карандаш","name":"Карандаш"},{"id":2,"low_name":"синий фломастер","name":"Фломастер"},{"id":3,"low_name":"черный маркер","name":"Маркер"}]);


Как исправить эту ошибку?

Файл json , который я пытаюсь получить через ajax создается заново каждый день и встроить его в js файл нет возможности.

рони
10.12.2018, 03:29
ishurgaya,
всё что вам нужно, надо делать в конце строки 19, а не в строке 30.
асинхронность!!!

laimas
10.12.2018, 06:04
JSON.stringify(xmlhttp.responseText)

Это зачем?

ishurgaya
10.12.2018, 08:43
ishurgaya,
всё что вам нужно, надо делать в конце строки 19, а не в строке 30.
асинхронность!!!

я просто хочу чтобы после загрузке страницы запустился ajax и задал значение переменной.

А потом уже по событию keyup в текстовом поле с id search_field запускался поиск:
document.addEventListener("keyup", function(e) {
if (e.target.id == 'search_field')
{
if(e.target.value.length > 1){
products = searchPositions(json, "текст");
}
});

Так невозможно сделать заранее задать значение переменной?

рони
10.12.2018, 08:52
ishurgaya,
document.addEventListener("keyup",
надо делать в конце строки 19,
надо научится так делать и мыслить.
Так невозможно сделать заранее задать значение переменной?
можно, но когда нибудь потом, es6, но под капотом будет тоже самое что выше.

ishurgaya
10.12.2018, 09:01
Это зачем?

иначе:
SyntaxError: JSON.parse: unexpected non-whitespace character after JSON data at line 1 column 105 of the JSON data

laimas
10.12.2018, 09:04
ishurgaya,
с сервера запрашивается json, сервер его и отдает, так? Значит полученное от сервера нужно декорировать, а не кодировать. А ошибка от того, что сервер отдает невалидный json, вот с этим и надо разбираться.

ishurgaya
10.12.2018, 09:20
действительно.
laimas и рони огромное спасибо!

Перенес код ниже в 19 строку

document.addEventListener("keyup", function(e) {

if (e.target.id == 'search_field')
{
if(e.target.value.length > 1){
products = searchPositions(json, "текст");
}
});

JSON.stringify убрал. действительно был некоректный json, добавил [ ]