БД JSON вывод через jQuery

[Infinity178]

Доброго дня!

с JSON я полный нуб.. Не прошу решать задачу за меня, достаточно будет дать ссылки на нормальный мануал.

Задача:
База параметров JSON (или можно аналог, json как по мне вид приятней)
Нужно вывести в SELECT (список) через JavaScript или лучше jQuery

Скелет базы, примерно:

{
"effects": {
"name1": "value1",
"name2": "value2",
"name3": "value3"
},
"easing": [
"name1": "value1",
"name2": "value2"
]
}

Я не могу просто понять каким способом привязать JSON к JQ функции и преобразовать массив в переменные

Заранее огромная благодарность за любую информацию по теме.

[dd_smol]

Пример HTML на выходе, который должен получится можно?
Преобразования строки в объект: $.parseJSON
Перебрать объект или массив: $.each

Отсебятина:

jQuery(function($) {
var data = $.parseJSON('{"effects": {"name1": "value1", "name2": "value2", "name3": "value3"},' +
'"easing": {"name1": "value1", "name2": "value2"}}');

$.each(data, function( name, value ) {
if ( $.isPlainObject( value ) || $.isArray( value ) ) {
var select = $('<select />', {'name': name});

$.each( value, function( name, value ) {
select.append( $('<option />', {'value': name, 'text': value}) );
});

$('body').append(select);
}
});
});


На выходе получится:

<select name="effects">
<option value="name1">value1</option>
<option value="name2">value2</option>
<option value="name3">value3</option>
</select>
<select name="easing">
<option value="name1">value1</option>
<option value="name2">value2</option>
</select>

[Infinity178]

На выходе - HTML то что нужно. но вот проблема:

если мы парсим через $.parseJSON - данные через файл не загрузить
если мы используем $.getJSON - то не пойму как преобразовать строки...

+ что касательно HTML - то тут момент следующий:

<select> = jsonNAME {JSON}

и установить нужно каждый SELECT в нужный блок.

Детальный пример на выходе:

<div class="divID">
<span>Эффекты для изображения</span>
<select name='loadJSON-effects'>.....</select>
</div>
<div class="divID">
<span>Эффекты для страницы</span>
<select name='loadJSON-page'>.....</select>
</div>
.... ect.

[Infinity178]

я полагаю логически нужно установить ключи по которым будет отбор строк, дальнейшее преобразование и вывод в HTML

[dd_smol]

В $.getJSON сам преобразовывает строку в js объект т.ч $.parseJSON не требуется.

[Infinity178]

если
{
"name":"value"
}
результат нужный

но если

{
"exemple" {
"name":"value"
}
}

то выдает objectObject

[Infinity178]

просто не особо хочется создавать N кол-во .json

[danik.js]

выдает objectObject
Так ты сделай два each(), один вложи в другой, как у dd_smol в примере.

[dd_smol]

При условии, что, если есть данный HTML на страницы реализовать можно таким образам.
<div class="divID">
<span>Эффекты для изображения</span>
<select name='loadJSON-effects'></select>
</div>
<div class="divID">
<span>Эффекты для страницы</span>
<select name='loadJSON-easing'></select>
</div>

// json.php: '{"effects": {"name1": "value1", "name2": "value2", "name3": "value3"}, "easing": {"name1": "value1", "name2": "value2"}}'
jQuery(function($) {
$.getJSON('json.php', function( data ) {
$.each(data, function( select, options ) {
var select = $('select[name=loadJSON-' + select + ']');

if ( !select && !($.isPlainObject( options ) || $.isArray( option )) ) {
return;
}

$.each(options, function( value, text ) {
select.append('<option value="' + value + '">' + text + '</option>');
});
});
});
});

Если же создавать SELECT на лету, то мне нужно понять по какому принципу их вставлять в блоки <div class="divID">
Ведь у каждого блока свой уникальный заголовок <span>Эффекты для изображения</span> || <span>Эффекты для страницы</span>

[Infinity178]

Огромная благодарность dd_smol

Этого решения достаточно для выгрузки. Я правильно понимаю -
Каждый след. уровень в JSON формате это дополнительный цикл в jQuery?

[dd_smol]

JSON это форма передачи данных - строка записанная по особым правилам которая в дальнейшим может быть преобразована в js объект. И с этим объектом можно работать так же само как с любым другим. ))

[Infinity178]

ок. а _POST если делать грубо будет выглядить следующим образом:

$.ajax({
url: "ajax/json.php",
data: { name: name, value: value },
dataType: 'json',
success: function(data) { }
});

[Infinity178]

Дочитал манул, получается если записываем в JSON то ровно как вы говорить про _GET, наоборот. Мы должны объект JS преобразовать в строку и соответственно записать в файл. - Верно?

[dd_smol]

Обычно в обратную сторону реже приходится работать, но все же такая возможность есть. В стандартной комплектации в jQuery инструмента нет, но полно разных плагинов (https://code.google.com/p/jquery-json/downloads/list) которое этот пробел в кавычках восполняют. Так же в ES5 появился собственные инструмент для работы с JSON (http://learn.javascript.ru/json).