Форум программистов «Весельчак У»
  *
Добро пожаловать, Гость. Пожалуйста, войдите или зарегистрируйтесь.
Вам не пришло письмо с кодом активации?

  • Рекомендуем проверить настройки временной зоны в вашем профиле (страница "Внешний вид форума", пункт "Часовой пояс:").
  • У нас больше нет рассылок. Если вам приходят письма от наших бывших рассылок mail.ru и subscribe.ru, то знайте, что это не мы рассылаем.
   Начало  
Наши сайты
     
  Галерея  
  Весельчак У  
  Наша Вики  
  Хранилище  
  Проекты  
     
Правила
     
  Правила форума Правила русского языка  
     
Помощь Поиск Календарь Почта Войти Регистрация  
Форум программистов «Весельчак У» > Направления программирования > Web > Клиентские скрипты > Тема: Список php/js (дерево)
 
Страниц: [1]   Вниз
« предыдущая тема следующая тема »
  Печать  
Автор Тема: Список php/js (дерево)  (Прочитано 26227 раз)
0 Пользователей и 12 Гостей смотрят эту тему.
la_vanille_ciel
Интересующийся

ru
Offline Offline
« : 20-05-2008 02:52 » 
Необходимо создать список или по-другому дерево, которое выглядит таким образом, что при нажатии на узел, подузлы у него выпадают.
Вот есть дерево:
Код:
<html>
<head>
  <title>Untitled web-page</title>
</head>
<body>

<?php

function get_tree($parent_id = 0)
  {
	 $out="<ul>";
	 $query = "SELECT * FROM structure WHERE parent_id = &#39;$parent_id&#39;";
	 $result = mysql_query($query);
    while ($row = mysql_fetch_array($result))
    {
      $out .= "<li>". "razdel_name =". $row[&#39;razdel_name&#39;]." ";
      $out .= "ID_RAZDEL=". $row[&#39;ID_RAZDEL&#39;]." ";
      $out .= "parent_id=". $row[&#39;parent_id&#39;]." ";
      $out .= " ";
      $out .=get_tree($row[&#39;ID_RAZDEL&#39;]);
      $out .="</li>";
	 }
    return $out."</ul>";  
  }

$link = mysql_connect("localhost", "root", "1") or die(mysql_error());
mysql_select_db("cad_ugdp", $link) or die(mysql_error());
$test = get_tree();
echo $test;


//Начинаем с начальной строки
$tree_items = "[ [&#39;HOME&#39;, &#39;index.php&#39;, ";

//Вызываем функцию для построения меню
for ($i = 1; $i <= 4; $i++) {
$tree_items .= get_tree($i);

}
//Заканчиваем структуру конечной строкой
$tree_items .= "] ];"; //Вс&#38;#38;#184;, структура для меню получена



?>
</body>

</html>

И есть список:
Код:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<script type="text/javascript">
function subDisplay(subName)
{
    var el = document.getElementById(subName);
    if (el.style.display!='block')
    {
       el.style.visibility='visible';
      el.style.display='block';
    }
    else
    {
       el.style.visibility='hidden';
       el.style.display='none';
    }
}
</script>
</head>
<body>
<ul>
<li><a href="#">1</a></li>
<li><a href="#" onclick="subDisplay('s2')">2</a>
   <ul id="s2">
     <li><a href="#">2.1</a></li>
   </ul>
   </li>
</ul>
</body>
</html>

И теперь надо сделать один скрипт такой, который будет делать список/дерево, у которого подпункты основных пунктов выпадают.

Да, и вот такая табличка в базе данных:
Код:
CREATE TABLE STRUCTURE (
     ID_RAZDEL int(11) NOT NULL auto_increment,
     razdel_name varchar(255) NOT NULL DEFAULT '',
     path varchar(50) NOT NULL DEFAULT '',
     parent_id int(11) not null default '0',
     PRIMARY KEY (ID_RAZDEL)
) ENGINE=INNODB;
« Последнее редактирование: 20-05-2008 02:56 от la_vanille_ciel » Записан
Sla
Команда клуба

ua
Offline Offline
Пол: Мужской

WWW
« Ответ #1 : 20-05-2008 07:44 » 
тебе нужно
в дочерние списки добавить
id для возможности видимости списка
т.е. манипулировать значением
"subDisplay('s2')"
и
<ul id="s2">
Записан
Мы все учились понемногу... Чему-нибудь и как-нибудь.
Sla
Команда клуба

ua
Offline Offline
Пол: Мужской

WWW
« Ответ #2 : 20-05-2008 07:54 » 
можно использовать static переменную
function get_tree($parent_id = 0)
  {
static $id=0;

при входе в функцию инкремнетируется
при віходе декрементируется
Записан
Мы все учились понемногу... Чему-нибудь и как-нибудь.
Sla
Команда клуба

ua
Offline Offline
Пол: Мужской

WWW
« Ответ #3 : 20-05-2008 08:00 » 
т.е. код приблизительно такой
function get_tree($parent_id = 0)
  {
static $id=0;
$id++; /*инкремент*/
get_tree;
$id--; /*декремент*/
Записан
Мы все учились понемногу... Чему-нибудь и как-нибудь.
la_vanille_ciel
Интересующийся

ru
Offline Offline
« Ответ #4 : 20-05-2008 08:02 » 
То есть эту новую статик get_tree будем использовать вместо старой? Или ее нужно вставить туда, где js ?
Записан
Sla
Команда клуба

ua
Offline Offline
Пол: Мужской

WWW
« Ответ #5 : 20-05-2008 08:08 » 
нет, это нужно вставить в
php скрипт

вот попробуй
Код:
<html>
<head>
  <title>Untitled web-page</title>
</head>
<body>

<?php

function get_tree($parent_id = 0)
  {
static $id=0;
	 $out="<ul>";
	 $query = "SELECT * FROM structure WHERE parent_id = &#39;$parent_id&#39;";
	 $result = mysql_query($query);
    while ($row = mysql_fetch_array($result))
    {


      $out .= "<li>". "razdel_name =". $row[&#39;razdel_name&#39;]." ";
$out .= "  ".$id. "  ";
      $out .= "ID_RAZDEL=". $row[&#39;ID_RAZDEL&#39;]." ";
      $out .= "parent_id=". $row[&#39;parent_id&#39;]." ";
      $out .= " ";
$id++;
      $out .=get_tree($row[&#39;ID_RAZDEL&#39;]);
$id--;
      $out .="</li>";
	 }
    return $out."</ul>";  
  }

$link = mysql_connect("localhost", "root", "1") or die(mysql_error());
mysql_select_db("cad_ugdp", $link) or die(mysql_error());
$test = get_tree();
echo $test;


//Начинаем с начальной строки
$tree_items = "[ [&#39;HOME&#39;, &#39;index.php&#39;, ";

//Вызываем функцию для построения меню
for ($i = 1; $i <= 4; $i++) {
$tree_items .= get_tree($i);

}
//Заканчиваем структуру конечной строкой
$tree_items .= "] ];"; //Вс&#38;#38;#184;, структура для меню получена



?>
</body>

</html>
Записан
Мы все учились понемногу... Чему-нибудь и как-нибудь.
la_vanille_ciel
Интересующийся

ru
Offline Offline
« Ответ #6 : 20-05-2008 08:14 » 
Получается такой же результат, как и при старом варианте php кода..я наверно, что-то не поняла..
То есть для чего мы делали статик get_tree?
« Последнее редактирование: 20-05-2008 08:16 от la_vanille_ciel » Записан
Sla
Команда клуба

ua
Offline Offline
Пол: Мужской

WWW
« Ответ #7 : 20-05-2008 08:21 » 
ну почему же старый?
ты видишь как меняется ID в зависимости от вложенности
Записан
Мы все учились понемногу... Чему-нибудь и как-нибудь.
la_vanille_ciel
Интересующийся

ru
Offline Offline
« Ответ #8 : 20-05-2008 08:25 » 
ДА, дошло!!! Там циферки по узлам распределены....
А как теперь, чтобы ссылками сделать?
Записан
Sla
Команда клуба

ua
Offline Offline
Пол: Мужской

WWW
« Ответ #9 : 20-05-2008 08:47 » 
вооот, теперь мы пришли к котлетам, или к мухам.
Код:
function get_tree($parent_id = 0)
  {
static $id=0;
	 $out="<ul>";
	 $query = "SELECT * FROM structure WHERE parent_id = '$parent_id'";
	 $result = mysql_query($query);
    while ($row = mysql_fetch_array($result))
    {


      $out .= "<li>";
/* вот где-то тут нужно сформировать тег <a>
следующего вида
      $out .= "<a href=\"НУЖНАЯ ССЫЛКА\">";
*/
$out .= "razdel_name =". $row['razdel_name']." ";
$out .= "  ".$id. "  ";
      $out .= "ID_RAZDEL=". $row['ID_RAZDEL']." ";
      $out .= "parent_id=". $row['parent_id']." ";
      $out .= " ";
/*а вот здесь тег <a> нужно закрыть
      $out .= "</a>";
$id++;
      $out .=get_tree($row['ID_RAZDEL']);
$id--;
      $out .="</li>";
	 }
    return $out."</ul>";  
  }
/code]
Записан
Мы все учились понемногу... Чему-нибудь и как-нибудь.
la_vanille_ciel
Интересующийся

ru
Offline Offline
« Ответ #10 : 20-05-2008 08:53 » 
 Жаль
ошибка:
Код:
Warning: Unterminated comment starting line 29 in C:\Program Files\Apache Group\Apache\htdocs\cad_ugdp\working\tree_test2.php on line 29

Parse error: syntax error, unexpected $end in C:\Program Files\Apache Group\Apache\htdocs\cad_ugdp\working\tree_test2.php on line 29
Записан
la_vanille_ciel
Интересующийся

ru
Offline Offline
« Ответ #11 : 20-05-2008 09:33 » 
Sla,
спасибо! Теперь ссылки есть:
Код:
<html>
<head>
  <title>Untitled web-page</title>
</head>
<body>

<?php


function get_tree($parent_id = 0)
  {
static $id=0;
	 $out="<ul>";
	 $query = "SELECT * FROM structure WHERE parent_id = &#39;$parent_id&#39;";
	 $result = mysql_query($query);
    while ($row = mysql_fetch_array($result))
    {

      $out .= "<li>";
// вот где-то тут нужно сформировать тег <a>
//следующего вида
       $out .= "<a href=\"#\">";
      //$out .= "<a href=\"НУЖНАЯ ССЫЛКА\">";

$out .= "razdel_name =". $row[&#39;razdel_name&#39;]." ";
$out .= "  ".$id. "  ";
      $out .= "ID_RAZDEL=". $row[&#39;ID_RAZDEL&#39;]." ";
      $out .= "parent_id=". $row[&#39;parent_id&#39;]." ";
      $out .= " ";
//а вот здесь тег <a> нужно закрыть
      $out .= "</a>";
$id++;
      $out .=get_tree($row[&#39;ID_RAZDEL&#39;]);
$id--;
      $out .="</li>";
	 }
    return $out."</ul>";  
  }

$link = mysql_connect("localhost", "root", "7") or die(mysql_error());
mysql_select_db("cad_ugdp", $link) or die(mysql_error());
$test = get_tree();
echo $test;


//Начинаем с начальной строки
$tree_items = "[ [&#39;HOME&#39;, &#39;index.php&#39;, ";

//Вызываем функцию для построения меню
for ($i = 1; $i <= 4; $i++) {
$tree_items .= get_tree($i);

}
//Заканчиваем структуру конечной строкой
$tree_items .= "] ];"; //Вс&#38;#38;#38;#184;, структура для меню получена



?>
</body>

</html>
Теперь нужно их схлопывать
Записан
Sla
Команда клуба

ua
Offline Offline
Пол: Мужской

WWW
« Ответ #12 : 20-05-2008 09:47 » 
так как id тега должен быть уникален, т.е. мы должны получить что-то типа такого
Код:
<ul>
<li><a href="#">1</a></li>
<li><a href="#" onclick="subDisplay('s2')">2</a>
   <ul id="s2">
     <li><a href="#">2.1</a></li>
     <li><a href="#">2.2</a></li>
   </ul>
   </li>
<li><a href="#" onclick="subDisplay('s3')">3</a>
   <ul id="s3">
     <li><a href="#">3.1</a>
         <ul id ="s4">
              <li><a href="#">3.1.1</a></li>
              <li><a href="#">3.1.2</a></li>
     </li>
     <li><a href="#">3.2</a></li>
   </ul>
   </li>

</ul>
то для такого рода списка, нужно иметь и уникальный $id
т.е. после вызова дочернего get_tree не нужно иметь декремента
Записан
Мы все учились понемногу... Чему-нибудь и как-нибудь.
Sla
Команда клуба

ua
Offline Offline
Пол: Мужской

WWW
« Ответ #13 : 20-05-2008 12:05 » new
Код:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
  <title>Untitled web-page</title>
<script type="text/javascript">
function subDisplay(subName)
{
    var el = document.getElementById(subName);
    if (el.style.display!='block')
    {
       el.style.visibility='visible';
      el.style.display='block';
    }
    else
    {
       el.style.visibility='hidden';
       el.style.display='none';
    }
}
</script>
</head>
<body>

</head>
<body>
<?php
function get_tree($parent_id = 0)
  {
static $id=0;
    $out="<ul id=\"s". $id ."\">";
    $query = "SELECT * FROM structure WHERE parent_id = &#39;$parent_id&#39;";
    $result = mysql_query($query);
    while ($row = mysql_fetch_array($result))
    {
      $out .= "<li>";
// вот где-то тут нужно сформировать тег <a>
//следующего вида
      $out .= "<a href=\"#\" ";

      $out .= "onclick=\"subDiasplay(&#39;s". $id. "&#39;)>";
      //$out .= "<a href=\"НУЖНАЯ ССЫЛКА\">";
      $out .= "razdel_name =". $row[&#39;razdel_name&#39;]." ";

      $out .= "  ".$id. "  ";
      $out .= "ID_RAZDEL=". $row[&#39;ID_RAZDEL&#39;]." ";
      $out .= "parent_id=". $row[&#39;parent_id&#39;]." ";
      $out .= " ";
//а вот здесь тег <a> нужно закрыть
      $out .= "</a>";
$id++;
      $out .=get_tree($row[&#39;ID_RAZDEL&#39;]);
      $out .="</li>";
	 }
    return $out."</ul>";  
  }

$link = mysql_connect("localhost", "root", "7") or die(mysql_error());
mysql_select_db("cad_ugdp", $link) or die(mysql_error());
$test = get_tree();
echo $test;


//Начинаем с начальной строки
$tree_items = "[ [&#39;HOME&#39;, &#39;index.php&#39;, ";

//Вызываем функцию для построения меню
for ($i = 1; $i <= 4; $i++) {
$tree_items .= get_tree($i);

}
//Заканчиваем структуру конечной строкой
$tree_items .= "] ];"; //Вс&#38;#38;#38;#184;, структура для меню получена



?>
</body>

</html>
вот промежуточный код, возможны ошибки
Записан
Мы все учились понемногу... Чему-нибудь и как-нибудь.
la_vanille_ciel
Интересующийся

ru
Offline Offline
« Ответ #14 : 20-05-2008 15:40 » 
Рисуется одна точка первая и все.
Это связано с  none в функции subDisplay ?
Записан
Sla
Команда клуба

ua
Offline Offline
Пол: Мужской

WWW
« Ответ #15 : 20-05-2008 21:35 » 
ничего подобного, это связано с разметкой html, в частности вот тута (или здеся) (или тама)
было
$out .= "onclick=\"subDiasplay('s". $id. "')>";
нуно
$out .= "onclick=\"subDiasplay('s". $id. "')\">";

реально будут еще бока, но мы их с тобой вычистим по мере поступления как вопросов, так и ответов Улыбаюсь
Записан
Мы все учились понемногу... Чему-нибудь и как-нибудь.
la_vanille_ciel
Интересующийся

ru
Offline Offline
« Ответ #16 : 26-05-2008 17:19 » 
Было бы здорово!

Я нашла еще скрипт дерева готовый без боков вроде...вот смотри:

http://www.mattkruse.com/javascript/mktree/source.html

Оно хорошо рисуется.
Теперь проблема в другом. Мне хотелось бы, чтобы страница выглядела так: Слева колонка с деревом и дальше справа описание. То есть выбираешь раздел, подраздел, элемент в дереве в левой колонке, нажимаешь на этот элемент и справа появляется описание и ссылка для скачки.

То есть в базе у меня есть таблица, которая содержит информацию о каждом элементе:
Код:
ID_DRAWING int(11) NOT NULL auto_increment,    
    drawing_name varchar(60) NOT NULL default '', 
    weight int(11) NOT NULL default '0', 
    downloads_amount int(5) NOT NULL default '0', 
    description varchar (300) NOT NULL default '',
    index_url varchar(100) NOT NULL default 'http://',
    PRIMARY KEY  (ID_DRAWING), 
    RAZDEL_ID int(11),
    index raz_id (RAZDEL_ID),
    FOREIGN KEY (RAZDEL_ID) REFERENCES STRUCTURE (ID_RAZDEL) on delete cascade,


То есть при нажатии на элемент должна как-то браться информация из этой таблице о выбранном элементе и выводиться справа в колонке, а именно описание и там же ссылка, по которой происходит скачка.
Записан
la_vanille_ciel
Интересующийся

ru
Offline Offline
« Ответ #17 : 27-05-2008 03:52 » 
Надо вот как тут например:
http://www.ajaxtopics.com/treemenu.html
только на php и javascript Жаль
Записан
Sla
Команда клуба

ua
Offline Offline
Пол: Мужской

WWW
« Ответ #18 : 27-05-2008 06:31 » 
la_vanille_ciel, ты путаешь php, html, javscript
я тебе уже давал "натырку" ознакомиться со стилями
давал пример реализованного меню/подменю
и даже больше - мы это с тобой сделали.

Задавай более уточнённые запросы, а не "хочу вот так" Улыбаюсь
Записан
Мы все учились понемногу... Чему-нибудь и как-нибудь.
Страниц: [1]   Вверх
  Печать  
« предыдущая тема следующая тема »
 
Форум программистов «Весельчак У» > Направления программирования > Web > Клиентские скрипты > Тема: Список php/js (дерево)

Powered by SMF 1.1.21 | SMF © 2015, Simple Machines