Как обработать json ответ сервера на клиенте?

Question

[Илья]

Здравствуйте.

Есть кнопка:

<a href="#" data-toggle="modal" data-target="#editUser" onclick="idUser(<?=$data->id;?>)"><span class="glyphicon glyphicon-pencil"></span></a>

Отсылаю на сервер id через ajax:

<script>
		function idUser(id) {
			$.ajax({
				type: 'POST',
				url: '/frontend/users_admin/delete',
				data: id,
				success: function(data) {
					console.log(id);
				}
			});

		}
	</script>

На сервере обрабатывается запрос и формируется массив кодированный в json.

public function edit($id)
	{
		if ($data = $this->users_admin_model->get_data_user($id))
		{
			return json_encode($data);
		}
		else
		{
			return FALSE;
		}
	}

Вопрос. Как получить обратно этот массив на клиенте и перебрать его?
Спасибо за ответ.

Answer 1

[Евгений Петров]

Вы получаете массив

HTML

<a href="#" data-toggle="modal" data-target="#editUser" data-id="<?=$data->id;?>">...</a>

JS

$(document).on('click', '[data-toggle="modal"]', function () {
	$.ajax({
		url: '/frontend/users_admin/delete',
		type: 'POST',
		dataType: 'json',
		data: $(this).data('id')
	}).done(function(data) {
		console.log(data, data.length);
		for (var i = 0; i < data.length; i++) {
			console.log(data[i]);
		}
	}).fail(function(error) {
		console.log(error);
	});
});

Comments

[Илья]

Получается на сервер уже уходит json?
И как мне потом перебирать json клиенте? Буду благодарен хотя бы за ссылку на мануалы.

[Евгений Петров]

Нет-нет, JSON приходит с сервера. А на сервер уходит запрос по адресу с передачей параметра id в теле запроса.

Как перебирать? Как обычный JS-объект. Поскольку вы сказали, что возвращается массив, то я показал в коде простейший способ — с помощью цикла. Есть и другие способы (смотреть с левой стороны — reduce, every, forEach и прочие методы).

Если приходит не массив, а объект, то надёжней всего перебирать с помощью Object.keys(). Например так:

for (var list = Object.keys(data), i = list.length; i--;) {
	console.log(data[list[i]]);
}

Можно и с помощью for in, но нужно проверять собственность свойства — мало ли кто нагадил в прототип:

for (var i in data) {
	if (data.hasOwmProperty(i)) {
		console.log(data[i]);
	}
}

[Евгений Петров]

hasOwmProperty => hasOwnProperty

[Илья]

Если указывать тип данных dataType: 'json',
то данные не отправляются. Если не указывать тип данных, то возвращается пустой массив. Понимаю, что гадание на гущи, но что примерно может быть здесь неправильно работать?

[Евгений Петров]

dataType говорит только о том, что полученный ответ нужно преобразовать в JS-объект. Поскольку ответ является пустой строкой, то никакого преобразования не происходит, а значит и done не сработает. Смотрите на ошибку в fail.

Итог, впрочем, тот же — вы не умеете формировать JSON На сервере, и начинать следует оттуда.

[Илья]

Разобрался с возвращением. Ошибка на стороне сервера была. Последний вопрос, помогите пожалуйста.
Вот я получил объект. А как теперь из этого объекта мне подставить элементы в форму в input?

[Евгений Петров]

Создайте тему, приведите в ней короткий кусок формы, покажите кусок ответа.
Так вы получите варианты ответа на свой конкретный вопрос, и не только от меня.

Answer 2

[Дмитрий Скогорев]

ну так json_decode выдаст вам массив

Comments

[Илья]

Не на сервере. Смысл в том, что бы жмякаешь на кнопочку, id уходит на сервере через ajax, и возвращается в том же методе(на сервере) json. И как этот json обработать уже на КЛИЕНТЕ? Отдельным ajax запросом или что?

[Дмитрий Скогорев]

@ArtMavir а что у вас за клиент? может js может андроид. javascript.ru/forum/css-html/37869-kak-parsit-json.html