Отправляет email-рассылки с помощью сервиса Sendsay

Web-программирование - это просто!

Подписаться Бесплатная «Серебряная» новостная рассылка . Подписчиков 681 RSS
←   Апрель 2012   →
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30


За последние 60 дней ни разу не выходила


Сайт рассылки: http://www.easyprog.ru
Открыта: 27-06-2009
Адрес автора: comp.soft.prog.easyweb-owner@subscribe.ru

Автор
Александр

Статистика

681 подписчиков
0 за неделю
←   Все выпуски   →

Web-программирование - это просто!


Новое на сайте Программирование - это просто! (www.easyprog.ru):

В разделе "Программные продукты":

В платном разделе

В бесплатном разделе

Добрый день, уважаемые подписчики!

Тема сегодняшнего выпуска: «Java Script(JS): Библиотека визуальных компонентов. Класс CXBrTreeView.  Визуальное дерево.

 

Скачать файлы с описанными классами можно здесь(версия 1.5)

Для углубленного изучения web-программирования (язык PHP и написание своей собственной CMS) советую подписаться на платный раздел (см. анонсы раздела "Пишем Easy CMS").

 

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

Тема сегодняшнего выпуска: «Java Script(JS): Библиотека визуальных компонентов. Класс CXBrTreeView. Визуальное дерево.

 

Для этого урока нам понадобиться новая версия 1.5 этой библиотеки. Скачайте ее отсюда.

И так, вот исходный текст этого примера:

<HTML>

    <head>

      <title></title>

        <LINK HREF="styles.css" REL="stylesheet" TYPE="text/css">

        <SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript" SRC="XBrBase.js">

        </SCRIPT>

        <SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript" SRC="XBrGlobalVars.js">

        </SCRIPT>

        <SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript" SRC="XBrGlobalProc.js">

        </SCRIPT>

        <SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript" SRC="XBrVisual.js">

        </SCRIPT>

        <SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript" SRC="XBrTrees.js">

        </SCRIPT>

        <SCRIPT Language="JavaScript" type="text/javascript">

       

             var vo1;

        </SCRIPT>

    </head>

 

    <BODY>

        <div id="1">

            div1

        </div>

        <div id="2">

            div2

        </div>

        <SCRIPT Language="JavaScript" type="text/javascript">

       

            function CXMyBrTreeView(object) {

                CXBrTreeView.call(this,object);

                this._on_node_click=CXMyBrTreeView_on_node_click;

            }

               

            function CXMyBrTreeView_on_node_click(id,level_node) {

                a=document.getElementById("2")

                a.innerHTML="Вы выбрали пункт "+id+" уровень "+level_node;

                alert(id+"   "+level_node)

            }

       

            var ob=new CXMyBrTreeView(document.getElementById("1"))

            ob._blank_image="imgtree/blank.gif"

            ob._plus_image="imgtree/plus.gif"

            ob._minus_image="imgtree/minus.gif"

           

 

            arr=new Array

            arr["_open_image"]="imgtree/open.gif"

            arr["_close_image"]="imgtree/closed.gif"

            arr["_end_image"]="imgtree/document.gif"

 

            arr1=new Array

            arr1["_open_image"]="imgtree/open_new.gif"

            arr1["_close_image"]="imgtree/closed_new.gif"

            arr1["_end_image"]="imgtree/document.gif"

            arr1["_is_exploded"]=true

 

            arr2=new Array

            arr2["_open_image"]="imgtree/open.gif"

            arr2["_close_image"]="imgtree/closed.gif"

            arr2["_end_image"]="imgtree/document_new.gif"

 

            ob._nodes._add(new CХBrTreeNodes(null,"Проба",arr),"Главное",arr1)

            ob._nodes._add(new CХBrTreeNodes(null,"Проба1",arr),"Второй пункт",arr)

            ob._nodes._add(null,"Третий пункт",arr)

            ob._nodes._add(null,"Четвертый пункт",arr)

            ob._nodes._objects_list[0]._nodes._add(null,"Подпункт",arr)

            ob._nodes._objects_list[0]._nodes._add(null,"Еще подпункт",arr)

            ob._nodes._objects_list[1]._nodes._add(null,"123",arr)

            ob._nodes._objects_list[1]._nodes._add(null,"456",arr2)

            ob._nodes._objects_list[1]._nodes._add(null,"789",arr)

            ob._nodes._objects_list[0]._nodes._add(new CХBrTreeNodes(null,"Проба1",arr),"Подменю",arr)

            ob._nodes._objects_list[0]._nodes._objects_list[2]._nodes._add(null,"Первый пункт подменю",arr)

            ob._nodes._objects_list[0]._nodes._objects_list[2]._nodes._add(null,"Второй пункт подменю",arr)

            ob._nodes._objects_list[0]._nodes._objects_list[2]._nodes._add(new CХBrTreeNodes(null,"+++",arr),"Очень низкое подменю",arr)

            ob._nodes._objects_list[0]._nodes._objects_list[2]._nodes._objects_list[2]._nodes._add(null,"Ну вот и все",arr)

 

            ob._draw()

        </SCRIPT>

    </BODY>

</HTML>

 

В данном примере мы переопределили новый класс от CXMyBrTreeView, в котором задаем обработчик _on_node_click - реакция на клик по пункту визуального дерева:

Тема сегодняшнего выпуска: «Java Script(JS): Библиотека визуальных компонентов. Класс CXBrTreeView. Визуальное дерево.

 

С уважением, Шуравин Александр, e-mail: megabax@rambler.ru, автор оставляет за собой право публиковать в рассылках ваши письма, если в письме прямо неоговорено нежелание его публиковать.

 
В избранное