селект с выпадом другого селекта

Тема в разделе "Другие языки", создана пользователем ufaclub, 26 авг 2010.

Статус темы:
Закрыта.
Модераторы: Цукер
  1. ufaclub

    ufaclub

    Регистр.:
    1 май 2007
    Сообщения:
    395
    Симпатии:
    17
    как сделать селект с выпадом другого селекта

    тоесть список

    пункт 1
    пункт 2
    пункт 3
    пункт 4

    пользователь выбрал пункт 4 и ему открываться следующий селект

    пункт 4.1
    пункт 4.2
    пункт 4.3
    пункт 4.4

    и чтоб у каждого селекта был name чтоб выбранный пункт можно было отправить на почту


    как такое реализовать попроще? можно даж на джуквери....... попробывать
     
  2. KillDead

    KillDead

    Регистр.:
    11 авг 2006
    Сообщения:
    884
    Симпатии:
    540
    Это делается как раз через ajax или javascript. Называется это связные списки, динамический select...
    В инете есть примеры, например неплохой - Перейти по ссылке
     
    ufaclub нравится это.
  3. ufaclub

    ufaclub

    Регистр.:
    1 май 2007
    Сообщения:
    395
    Симпатии:
    17
    спасибо, а без джуквери примеры есть?
     
  4. KillDead

    KillDead

    Регистр.:
    11 авг 2006
    Сообщения:
    884
    Симпатии:
    540
    возможно есть- нужно просто записать тот или иной селект в слой. Это с помощью javascript.
    Если хочется вообще избавится от javascript- не получится удобно. Можно организовать заполнение в 2 этапа- при выборе 1-го селекта страница обнавляется (или пользователь сам жёт кнопку, след шаг, это уже без js) а пхп печатает нужную форму.
     
  5. diavolic

    diavolic

    Регистр.:
    17 мар 2010
    Сообщения:
    522
    Симпатии:
    102
  6. bork75

    bork75 The Team

    Регистр.:
    21 июн 2008
    Сообщения:
    1.450
    Симпатии:
    717
    Писал что-то похожее, может подойдёт(при выборе страны, в списке появляются соответствующие города)

    Просто вставь и посмотри как работает.

    Код:
    <script type="text/javascript">
    
    var regiondb = new Object()
    regiondb["africa"] = [{value:"1", text:"Каир"},
    {value:"2", text:"Триполи"},
    {value:"3", text:"Алжир"},
    {value:"4", text:"Претория"}];
    regiondb["asia"] = [{value:"1", text:"Банкок"},
    {value:"2", text:"Дели"},
    {value:"3", text:"Улан-Батор"},
    {value:"4", text:"Джакарта"},
    {value:"5", text:"Токио"}];
    regiondb["australia"] = [{value:"1", text:"Мельбурн"},
    {value:"2", text:"Сидней"}];
    regiondb["europe"] = [{value:"1", text:"СПб"},
    {value:"2", text:"Лондон"},
    {value:"3", text:"Афины"},
    {value:"4", text:"Барселона"},
    {value:"5", text:"Париж"},
    {value:"6", text:"Рим"},
    {value:"7", text:"Москва"},
    {value:"69", text:"Бабруйск :)"}];
    regiondb["noamer"] = [{value:"1", text:"Нью-Йорк"},
    {value:"2", text:"Вашингтон"},
    {value:"3", text:"Лос Анджелес"},
    {value:"4", text:"Оттава"}];
    regiondb["soamer"] = [{value:"1", text:"Рио дэ Жанейро"},
    {value:"2", text:"Лима"},
    {value:"3", text:"Каракас"}];
    
    function setCities(chooser) {
    var cityChooser = chooser.form.elements["city"];
    // обнуляем список
    cityChooser.options.length = 0;
    // получаем value для массива regiondb
    var choice = chooser.options[chooser.selectedIndex].value;
    var db = regiondb[choice];
    // вставляем первый элемент
    cityChooser.options[0] = new Option("Город: ", "", true, false);
    if (choice != "") {
    for (var i = 0; i < db.length; i++) {
    cityChooser.options[i + 1] = new Option(db[i].text, db[i].value);
    }
    }
    }
    
    </script>
    </head>
    <body>
    <form name="dealers" action="">
    <select name="continent" onchange="setCities(this)">
    <option value="" selected>Континент: </option>
    <option value="africa">Африка</option>
    <option value="asia">Азия</option>
    <option value="australia">Австралия</option>
    <option value="europe">Европа</option>
    <option value="noamer">С. Америка</option>
    <option value="soamer">Ю. Америка</option>
    </select>&nbsp;
    <select name="city" size="7">
    <option value="" selected>Город: </option>
    </select>
    </form>
    
     
Статус темы:
Закрыта.