Javascript-форум - Создание списка из полей и ключей многомерного массива

Javascript-форум (https://javascript.ru/forum/)

- Events/DOM/Window (https://javascript.ru/forum/events/)

- - Создание списка из полей и ключей многомерного массива (https://javascript.ru/forum/events/43467-sozdanie-spiska-iz-polejj-i-klyuchejj-mnogomernogo-massiva.html)

Создание списка из полей и ключей многомерного массива

Добрый вечер! Решаю проблему формирования списка-дерева.

Имеется к примеру такой массив:

$mas = array ( "City"  => array ( "a" => "New-York",
                                   "b" => "London",
                                   "c" => "Moscow"
                                 ),
              "Numbers"   => array ( "element-1",
                                   "element-2",
                                   "element-3",
                                   "element-4",
                                   "element-5",
                                   "element-6"
                                 ),
              "Other"   => array (      "one",
                                    5 => "two",
                                         "three",
                    7=> array ("mas10", "mas15")    
                                 )
            );

После преобразования в JSON-формат массив выглядит так:

Код:

{

"City":{"a":"New-York","b":"London","c":"Moscow"},

 "Numbers" ["element-1","element-2","element-3","element-4","element-5","element-6"],

 "Other":{"0":"one","5":"two","6":"three","7":["mas10","mas15"]}

}

Через JSON я передаю его в JS-код, в котором есть функция проставляющая теги списка:

Код:

function Dump(d,l) 

    {

      if (l == null) l = 1;

      var s = '';

      if (typeof(d) == "object") 

      {

        s += "<li><img src='../images/folder.gif' />";

        for (var k in d) 

        {



          s += "<ul>" + Dump(d[k],l+1)+"</ul>";



        }

        s += "</li>";

      } 

      else 

      {

        s += "<li><img src='../images/file.gif' />" + d + "</li>";

      }

      return s;

    }



str = Dump(data,1);

$("#span2").html(str);

И все это дело формируется в таком виде: http://www.imgup.ru/image-12jrx7161953.html

А хотелось бы сделать так чтобы заголовки элементов которые являются массивами в свою очередь (как например "City" или "7") показывали свои заголовки, а элементы которые просто хранят значения не показывали свои заголовки (такие как ключ "a", "5" или просто значения без указанного ключа как к примеру "element-3", "mas15" и т.д.). Как это сделать? Пробовал выводить значения k в цикле, но оно выводит аболютно все ключи, даже которые не являются массивами.

Цитата:

Сообщение от IntegralAL

преобразования в JSON-формат массив выглядит так:

{
	"City": {
		"a": "New-York",
		"b": "London",
		"c": "Moscow"
	},
	"Numbers" ["element-1", "element-2", "element-3", "element-4", "element-5", "element-6"],
	"Other": {
		"0": "one",
		"5": "two",
		"6": "three",
		"7": ["mas10", "mas15"]
	}
}

Что у тебя есть - понятно... Но синтаксически не верно. :)

Вот это будет правильнее!

var obj = {
	"City": {
		"a": "New-York",
		"b": "London",
		"c": "Moscow"
	},
	"Numbers": ["element-1", "element-2", "element-3", "element-4", "element-5", "element-6"],
	"Other": {
		"0": "one",
		"5": "two",
		"6": "three",
		"7": ["mas10", "mas15"]
	}
};

А вот что из этого нужно получить - пока не ясно... :)
Ты сам руками можешь сделать нужных хтмл по этой структуре?
Вот и сделай. Потом покажи тут...

Я показал код JSON который получился в результате преобразования из массива php. Тут все правильно.

Просто в файле php применил:

echo json_encode($mas);

И если выполнять эту страницу, то на вывод подается как раз массив JSON.

Код:

{

"City":{"a":"New-York","b":"London","c":"Moscow"},

 "Numbers" ["element-1","element-2","element-3","element-4","element-5","element-6"],

 "Other":{"0":"one","5":"two","6":"three","7":["mas10","mas15"]}

}

Потом на главной странице index.html этот массив ловится и попадает в функцию Dump(d,l) в которой массив превращается в разметку html (точнее в списки li и ul). Так вот проблема в том, что у меня пока дерево строится, где подписаны только "листья" массивов, а ключи содержащие подмассивы не отображаются. Мне нужно чтобы все было как на картинке:

http://www.imgup.ru/image-12jrx7161953.html

только с небольшой разницей, чтобы папки тоже были подписаны. (а папки у нас это название ключей, содержащие в своих значениях подмассивы). Помогите эту проблему решить!

Цитата:

Сообщение от IntegralAL (Сообщение 284977)

Я показал код JSON который получился в результате преобразования из массива php. Тут все правильно.
И если выполнять эту страницу, то на вывод подается как раз массив JSON.

{
"City":{"a":"New-York","b":"London","c":"Moscow"},
 "Numbers" ["element-1","element-2","element-3","element-4","element-5","element-6"],
 "Other":{"0":"one","5":"two","6":"three","7":["mas10","mas15"]}
}

Как это может быть правильным? :blink:

<!DOCTYPE html>
<html>
<head>
<!--
<script src="http://code.jquery.com/jquery-latest.js"></script>
<link rel="stylesheet" type="text/css" href="tmp.css" />
-->
<style type="text/css">
</style>
<script type="text/javascript">
var obj={
"City":{"a":"New-York","b":"London","c":"Moscow"},
 "Numbers" ["element-1","element-2","element-3","element-4","element-5","element-6"],
 "Other":{"0":"one","5":"two","6":"three","7":["mas10","mas15"]}
};
</script>
</head>
<body>
</body>
</html>

Цитата:

Syntax error at line 13 while loading: syntax error
"Numbers" ["element-1","elemen

Цитата:

Сообщение от IntegralAL

Мне нужно чтобы все было как на картинке

Твоя структура не годится для этого... :no:
Т.к. не понятно, что будет "папкой", а что "текстом"... Нужно правильное сочетание объектов и массивов. Т.о. можно будет сделать элемент объекта папкой, а элементы массива - текстом.

Сейчас у тебя какая-то каша из объектов и массивов, причем синтаксически не верная...

Я не вижу визуальных отличий между моим массивом и твоим, с единственной разницей что ты его обрамил еще в скобки и присвоил переменной obj. Не знаю как у вас у меня на сервере массив php, преобразовывается в JSON-структуру. А затем через AJAX передается на главную страницу, а там в скрипте уже идет вызов функции Dump:

$(function() {
		var str = "";	
			  
		$.getJSON("controller.php", {}, function(data){ 
              
		str = Dump(data,1);
		
                      $("#span2").html(str);				 
		    });				
		});

И картинку посмотрите мою, у меня же формируются успешно данные из массива, значит все в порядке. Единственное, что нужно проименовать название папок. Этого я не знаю как сделать.

Почему каша-то? У меня элементы которые не содержат массивов отображаются как "файлы", а элементы которые содержат массивы выглядят как "папки". Это мне и надо. Единственное, что нужно подписать заголовки "папкам" - т.е. вывести название ключей, которые содержат подмассивы. Тоесть на первом уровне папок надо подписать их "City", "Numbers", "Other", на втором уровне только одну папку "7" содержащую массив ["mas10","mas15"].

Цитата:

Сообщение от IntegralAL

Я не вижу визуальных отличий между моим массивом и твоим

Ну тут разве, что очки посоветовать купить... :D

Ну это же не я сам его составил, во-первых, это php-код превратил из php-массива в JSON-структуру, он думаю ошибаться не будет. А, во-вторых, у меня нет ошибок с массивом, какие вы показывали мне. У меня проблема совсем в другом, чтобы подписать папки названиями ключей.

Цитата:

Сообщение от IntegralAL

подписать папки названиями ключей

У тебя функция Dump(d,l) принимает два параметра... Сделай их три.
Вызов у тебя

Dump(d[k],l+1)

Сделай так (порядок параметров на твое усмотрение)

Dump(d[k],l+1,k)

тогда у тебя будет "текст" самого свойства. Т.е. та самая подпись к папке. ;)

Первый вызов будет такой

str = Dump(data,1,'data');