VPF::помогите сделать динамический список

dexterx

Дата 10.9.2008, 23:19 (ссылка)

(нет голосов)

Загрузка ...

Шустрый

Профиль
Группа: Участник
Сообщений: 67
Регистрация: 8.9.2008

Репутация: нет
Всего: нет

Здравствуйте, у меня проблемка такого характера:
Я сделал список областей и городов, когда выбираешь оласть,
то в другом <option value> выпадают списком соответственно
города етой области...ето все у меня получилось но проблема вот в чем
етих выборов областей на странице у меня 6 штук и в каждой из них
около 800 <option value> ета страница самого кода без дизайна
занимает 300kb, естественно такое не катит и нужно какой
нибуть другой вариант, например у меня ета база городов есть
в mysql и может есть возможность каким то способом извлечь
их от туда и сдетать динамический выпадающий список
так как например у loveplanet.ru

У меня сейчас так:

Код



<script type="text/javascript">
function dynamicSelect(id1, id2) {

// Сперва необходимо проверить поддержку W3C DOM в браузере
 if (document.getElementById && document.getElementsByTagName) {

// Определение переменных, ссылающихся на списки
  var sel1 = document.getElementById(id1);
  var sel2 = document.getElementById(id2);

// Клонирование динамического списка
  var clone = sel2.cloneNode(true);

// Определение переменных для клонированных элементов списка
  var clonedOptions = clone.getElementsByTagName("option");

// Вызов функции собирающей вызываемый список

  refreshDynamicSelectOptions(sel1, sel2, clonedOptions);

// При изменении выбранного элемента в первом списке: // вызов функции пересобирающей вызываемый список
  sel1.onchange = function() {
  refreshDynamicSelectOptions(sel1, sel2, clonedOptions);
  }
 }
}
// Функция для сборки динамического списка

function refreshDynamicSelectOptions(sel1, sel2, clonedOptions) {

// Удаление всех элементов динамического списка

 while (sel2.options.length) {
  sel2.remove(0);
 }
 var pattern1 = /( |^)(select)( |$)/;
 var pattern2 = new RegExp("( |^)(" + sel1.options[sel1.selectedIndex].value + ")( |$)");

// Перебор клонированных элементов списка

 for (var i = 0; i < clonedOptions.length; i++) {
// Если название класса клонированного option эквивалентно "select" // либо эквивалентно значению option первого списка

  if (clonedOptions[i].className.match(pattern1) ||
  clonedOptions[i].className.match(pattern2)) {

// его нужно клонировать в динамически создаваемый список
   sel2.appendChild(clonedOptions[i].cloneNode(true));
  }
 }
}
window.onload = function() {
    dynamicSelect("incity1", "inregion1");
    dynamicSelect("incity2", "inregion2");
    dynamicSelect("incity....", "inregion....");
}
</script>

Код


<select name="incity1" id="incity1">
        <option value="">--Выберите город--</option>
        <option value='1'>Винницкая обл.</option>
        <option value='2'>Волынская обл.</option>
        <option value='3'>Днепропетровская обл.</option>
        <option value='4'>Донецкая обл.</option>
                        <option value='..'>...........</option>
</select>

<select name="inregion1" id="inregion1">
        <option class='2' value='9972'>Гвардейское</option>
        <option class='2' value='10236'>Гвардейское</option>
        <option class='3' value='10231'>Багерово</option>
        <option class='4' value='10561'>Базалия</option>
        <option class='3' value='9910'>Бар</option>
        <option class='3' value='10613'>Барва</option>
        <option class='4' value='10063'>Барановка</option>
        <option class='...' value='.........'>и еще 800 городов</option>
</select>

skyboy

Дата 11.9.2008, 11:34 (ссылка)

(нет голосов)

Загрузка ...

неОпытный

Профиль
Группа: Модератор
Сообщений: 9820
Регистрация: 18.5.2006
Где: Днепропетровск

Репутация: 14
Всего: 260

Цитата(dexterx @ 10.9.2008, 22:19

)

ето все у меня получилось но проблема вот в чем
етих выборов областей на странице у меня 6 штук и в каждой из них
около 800 <option value> ета страница самого кода без дизайна
занимает 300kb

тут не mysql надо.
вариантов много, подходов два:
- вариации на стороне клиента средствами javascript(например, можно передавать javascript-массив(один раз!) и уже на стороне клиента на основе массива создавать select'ы; либо передавать один select, а на стороне клиента дублировать его)
- смена архитектуры(подхода к реализации интерфейса) - например, сделать выбор города отдельным окном. с отдельным куском html-кода, который вполне себе закешируется браузером. и на странице выводить не select со списком городов, а кнопка, вызывающая окно выбора города. или изменить подход, чтоб город надо было выбирать один раз и все будет привязана к единственному выбору города.

Добавлено через 1 минуту и 27 секунд
а... так, ты так и делаешь: один раз передаешь и копируешь на стороне клиента столько раз, соклько нужно?

dexterx

Дата 11.9.2008, 23:22 (ссылка)

(нет голосов)

Загрузка ...

Шустрый

Профиль
Группа: Участник
Сообщений: 67
Регистрация: 8.9.2008

Репутация: нет
Всего: нет

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

whyte

Дата 16.9.2008, 14:58 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 29
Регистрация: 6.6.2008

Репутация: нет
Всего: нет

Если javascript не знаешь, то у тебя 2 варианта:
1. отказаться от нововведений
2. подучить javascript

Я бы на твоем месте использовал ajax.

0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема \| PHP: Базы Данных \| Следующая тема »