PHP и AJAX. Динамическая подгрузка <select> и <ul>

@F(r)an!k · Регистрация: 12.03.2010

Author24 — интернет-сервис помощи студентам

Всем привет)
У меня на сайте
[Ссылка удалена!]
есть Оочень большой
ненумерованный список
складывающийся гармошкой.
Как сделать так, чтобы
подпункты подгружались в него
непосредственное в момент их
открытия?

Аналогичная ситуация со списком
в <select>. Подгрузка <options>
только при нажатии на менюшку!

Давно ломаю голову,
заранее благодарен))

Комментарий модератора

Не нужно размещать ссылки на свой сайт!

@areostar · 19.08.2010, 13:36

Вы имеете введу Каскадное меню! Узайте CSS и гугл вам в помощ!!

Вот вам пример из моей практики:

Вбиваем список:

HTML5    
        
            
                
                
                
                
            
        
    Скопировано
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
31
32
33
34
35
<div align ="left" class ="menu">
        <ul> 
          <li><a href="index.php">Главная</a></li> 
          <li><a href="nadlan.php" onClick="get_category(1, 0)">Недвижимость</a> 
          </li> 
          <li><a href="#">Домашний ремонт</a> 
            <ul> 
              <li><a href="#">Ремонт Крыш</a></li> 
              <li><a href="#">Сантехника</a></li> 
              <li><a href="#">Установка и ремонт дверей</a></li> 
              <li><a href="#">Электрики</a></li> 
              <li><a href="#">Устаовка бойлеров</a></li> 
            </ul> 
          </li>
          <li><a href="auto.php">Автомобили</a> 
            <ul> 
              <li><a href="#">Купля\Продaжа</a></li> 
              <li><a href="#">Прокат Автомобилей</a></li> 
              <li><a href="#">Ремонт и обслуживание</a></li> 
            </ul> 
             </li> 
             <li><a href="mahshevim.php">Компютеры</a>
               <ul>
                 <li><a href="#">Продажа компютеров</a></li>
                 <li><a href="#">Ремонт и Обслуживание</a></li>
                 <li><a href="#">Разработка сайтов и программ </a></li>
               </ul>
             </li>
             <li><a href="#">Перевозки</a></li>
             <li><a href="#">Юр. Услуги</a>
               <ul>
                 <li><a href="#">Адвокаты</a></li>
                 <li><a href="#">Натариусы</a></li>
               </ul>
             </li>

и так далие сколько надо

Теперь создаем правила СSS:

CSS    
        
            
                
                
                
                
            
        
    Скопировано
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
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
      .menu  {
            position:absolute;
            left:1px;
            top:220px;
    }
    
    .menu ul {
            margin: 0;
            padding: 0;
            list-style: none;
            width: 250px;
            border-left: 1px solid #ccc;
            border-top: 2px solid #000000;
            border-right: 1px solid #ccc;
            border-bottom: 2px solid #000000
          }
          
  .menu ul li {
                position: relative; 
                height: 45px; 
                border-bottom: 2px solid #ccc;
           }
          
  .menu a {  font-weight:bold; }
          
  .menu li ul {
             position: absolute;
             left: 250px;
             top: 0;   
             border-style: 3px solid #ccc;
             display: none;
           }
          
  .menu  ul li a {
               display: block;
               text-decoration: none;
               color: #72f;
               border: 2px solid #000;
               background: #ffffff;
               padding: 15px; 
             }
          
  .menu  li:hover ul { display: block; } 
        
  .menu ul a:hover {
                   font-weight:bold;
                   font-size:16px;
                   border-style: 3px solid #000;
                   color: #00ff00;
                   background: #0a00a0;
                 }

от так както и будет вам счастье

@F(r)an!k · 19.08.2010, 21:48 **[ТС]**

Нет, вы меня не поняли)
Я выкладывал ссылку на пример,
но модератор ее удалил (!!!)

Вспомните преславутый "контакт",
когда вы ищите человека
либо что-то другое
перед Вами с права панель для поиска
с выбором страны, затем города.

HTML5    
        
            
                
                
                
                
            
        
    Скопировано
1
2
3
4
5
<select>
<option>Выберите страну</option>
<option>все страны...</option>
...
</select>

И только после выбора страны появляется
второе меню (в других средах ComboBox)
для выбора города, которое
подгужается динамически

HTML5    
        
            
                
                
                
                
            
        
    Скопировано
1
2
3
4
5
<select>
<option>Выберите город</option>
<option>все города...</option>
...
</select>

у меня именно такая задача!=)
но еще и со вторым меню <ul>

вот скриншоты:

@romchiksoad · 20.08.2010, 06:51

Сообщение от F(r)an!k

Нет, вы меня не поняли)
Я выкладывал ссылку на пример,
но модератор ее удалил (!!!)

Делайте скриншот а не ссылками пуляйтесь!

@prosto_lynx · 23.01.2012, 21:47

Кажется для реализации такой формы ajax обязателен... можно обойтись JavaScript'ом...

Новые блоги и статьи Все статьи Все блоги /
Оптимизация производительности Node.js с помощью кластеризации run.dev 04.04.2025 Масштабирование приложений для обработки тысяч и миллионов запросов — обыденная задача для многих команд. Node. js, благодаря своей асинхронной событийно-ориентированной архитектуре, стал популярной. . .	Управление зависимостями в Python с Poetry py-thonny 04.04.2025 Стандартный инструмент для установки пакетов в Python - pip - прекрасно справляется с базовыми сценариями: установил пакет командой pip install и используешь его. Но что произойдёт, когда разные. . .	Мониторинг с Prometheus в PHP Jason-Webb 04.04.2025 Prometheus выделяется среди других систем мониторинга своим подходом к сбору и хранению метрик. В отличие от New Relic, который использует агентный подход и отправляет данные во внешнее хранилище,. . .	Пакет Context в Golang: Управление потоками и ресурсами golander 04.04.2025 Работа с горутинами в Go часто напоминает управление непослушными детьми - они разбегаются кто куда, делают что хотят и не всегда завершаются вовремя. К счастью, в Go 1. 7 появился пакет context,. . .	Контейнеризация React приложений с Docker Reangularity 03.04.2025 Контейнеризация позволяет упаковать приложение со всеми его зависимостями в автономный контейнер, который можно запустить на любой платформе с установленным Docker. Это существенно упрощает процессы. . .
Свой попап в SwiftUI mobDevWorks 03.04.2025 SwiftUI, как декларативный фреймворк от Apple, предоставляет множество инструментов для создания пользовательских интерфейсов. В нашем распоряжении есть такие API как alerts, popovers, action sheets. . .	Антипаттерны микросервисной архитектуры ArchitectMsa 03.04.2025 Хорошо спроектированная микросервисная система может выдержать испытание временем, оставаясь гибкой, масштабируемой и устойчивой к большинству проблем. Такая архитектура обладает высоким уровнем. . .	std::mutex в C++: Советы и примеры использования bytestream 03.04.2025 std::mutex - это механизм взаимного исключения, который гарантирует, что критический участок кода выполняется только одним потоком в каждый момент времени. Это простое, но могущественное средство. . .	Не удержался от оценки концепции двигателя Стирлинга. Hrethgir 03.04.2025 Сколько не пытался - она выдавала правильные схемы, причём случайно рисовала горячие области в середине, холодные по краям, трубки с краёв в низ и магнит в соединяющей, но при этой выдавала описание. . .	Метод с двумя буферами (или double buffering) или ping-pong buffering Hrethgir 02.04.2025 Из ответов LM модели. Метод, который предполагает использование двух массивов для хранения промежуточных результатов сложения векторов, обычно применяется в сценариях, где необходимо минимизировать. . .

@romchiksoad 1957 / 796 / 89 Регистрация: 03.11.2009 Сообщений: 3,066 Записей в блоге: 2
	20.08.2010, 06:51
	Сообщение от F(r)an!k Нет, вы меня не поняли) Я выкладывал ссылку на пример, но модератор ее удалил (!!!) Делайте скриншот а не ссылками пуляйтесь! 0

@prosto_lynx 49 / 25 / 2 Регистрация: 09.06.2008 Сообщений: 227
	23.01.2012, 21:47
	Кажется для реализации такой формы ajax обязателен... можно обойтись JavaScript'ом... 0