За последние 24 часа нас посетил 18471 программист и 1620 роботов. Сейчас ищут 1097 программистов ...

Динамический select

Тема в разделе "JavaScript и AJAX", создана пользователем EvelRus, 23 дек 2007.

  1. ali_hacker

    ali_hacker Активный пользователь

    С нами с:
    23 дек 2008
    Сообщения:
    3
    Симпатии:
    0
    значения для 3-го select' a добавить попробовал, не получилось
     
  2. ali_hacker

    ali_hacker Активный пользователь

    С нами с:
    23 дек 2008
    Сообщения:
    3
    Симпатии:
    0
    Nemo
    как добавить значения для третьего select'a, я не смог сделать. помоги пожалуйста.
     
  3. Danil

    Danil Активный пользователь

    С нами с:
    17 дек 2008
    Сообщения:
    13
    Симпатии:
    0
    Адрес:
    бы ни был!
    [js]function CreateXMLHttpRequestObject()
    {
    var xmlHttp;
    try
    {
    xmlHttp = new XMLHttpRequest();
    }
    catch(e)
    {
    var XMLHttpVersions = new Array('MSXML2.XMLHTTP.6.0',
    'MSXML2.XMLHTTP.5.0',
    'MSXML2.XMLHTTP.4.0',
    'MSXML2.XMLHTTP.3.0',
    'MSXML2.XMLHTTP',
    'Microsoft.XMLHTTP');
    for(var i=0; i<XMLHttpVersions.length && !xmlHttp; i++) {
    try
    {
    xmlHttp = new ActiveXObject(XMLHttpVersions);
    }
    catch(e) {}
    }
    }
    if(!xmlHttp) {
    alert("Ваш браузер не поддерживает ассинхронную передачу");
    }
    else {
    return xmlHttp;
    }
    }[/js]

    Ни кто не замечал что проверка замедляет запрос?
    Я вот так делаю процентов на 25 быстрее

    [js]var xmlHttp = null;
    try { xmlHttp = new XMLHttpRequest(); }
    catch(e) { xmlHttp = null; }
    try { if(!xmlHttp) xmlHttp = new ActiveXObject("Msxml2.XMLHTTP"); }
    catch(e) { xmlHttp = null; }
    try { if(!xmlHttp) xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); }
    catch(e) { xmlHttp = null; }
    return xmlHttp;[/js]
     
  4. sword dancer

    sword dancer Активный пользователь

    С нами с:
    17 фев 2008
    Сообщения:
    295
    Симпатии:
    0
    интересно, зачем все эти проверки делать при КАЖДОМ запросе?
     
  5. Danil

    Danil Активный пользователь

    С нами с:
    17 дек 2008
    Сообщения:
    13
    Симпатии:
    0
    Адрес:
    бы ни был!
    Есть варианты лучше?
    В моем запросе особых проверок нет. Просто попытки создания для Mozila Opera Safari и для IE либо вообще null если браузер не поддерживает AJAX.
     
  6. kostyl

    kostyl Guest

    по слухам майкрософт новые версии работают быстрее и в них багов меньше и всё такое ;) а впрочем можно вообще не проверять...
     
  7. Mark32

    Mark32 Активный пользователь

    С нами с:
    15 июн 2008
    Сообщения:
    539
    Симпатии:
    2
    Отличный скрипт! Спасибо афтару!

    У меня вопрос по иному немного. <option disabled='disabled'></option>в ослике не работает, есть альтернатива на javascript сделать эту весчь?
     
  8. Andrey K.

    Andrey K. Активный пользователь

    С нами с:
    22 май 2007
    Сообщения:
    83
    Симпатии:
    0
    А не подскажите, как сделать индикатор загрузки? что бы юзер понял, что данные подгружаются, а не тупит страница?
     
  9. lencic

    lencic Активный пользователь

    С нами с:
    19 ноя 2009
    Сообщения:
    26
    Симпатии:
    0
    Привет.
    У меня вот такая проблема:
    Я сделала все как написано на форуме но у меня не получается. Я данные вывожу из БД MySQL. Элементы списка динамичные... Вот код пхп файла:
    Код (Text):
    1. <?php    
    2.         require 'inc/connect.php';
    3.  
    4.         //htmlspecialchars() Преобразует специальные символы в HTML сущности, будем считать для того, чтобы простейшие попытки взломать наш сайт обломались.
    5.         $_GET['id'] = htmlspecialchars($_GET['id']);
    6.  
    7.         // если у нас не запрашивали никакую определенную страницу, то будем выводить нашу самую первую. Если Вы ее давно удалили, поставьте вместо единички идентификатор той странички, которую Вы хотели бы грузить по умолчанию
    8.         if(empty($_GET['id'])) $_GET['id'] = 1;
    9.         $result = mysql_query("SELECT * FROM pages WHERE id = '".$_GET['id']."';", $link);
    10.         $row = mysql_fetch_array($result);
    11.  
    12. echo '<html>
    13. <head>
    14.   <title>'.$row['metatitle'].'</title>
    15.   <META NAME="description" CONTENT="'.htmlspecialchars(stripslashes($row['metadescription'])).'">
    16.   <META NAME="keywords" CONTENT="'.htmlspecialchars(stripslashes($row['metakeywords'])).'">
    17. <meta http-equiv="Content-Language" content="ru">
    18. <meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
    19. <script type="text/javascript">
    20.  function syncList()
    21.   {
    22.   }
    23.  
    24.  //Метод sync() - принимает список из значений атрибутов id элементов SELECT, образующих связанный список и запускает их синхронизацию
    25.   syncList.prototype.sync = function()
    26.   {
    27.       //Перебираем аргументы (id элементов SELECT) и назначаем событиям onChange селектов, с соответствующими id, функцию-обработчик.
    28.       //В качестве обработчика выступает второй метод объекта syncList - _sync (напрямую его вызывать не нужно)
    29.       //Обработчик назначается всем элементам SELECT кроме последнего в списке аргументов, т.к. последний не влияет ни на какой другой элемент SELECT и с ним не нужно синхронизироваться.
    30.       for (var i=0; i < arguments.length-1; i++)    document.getElementById(arguments[i]).onchange = (function (o,id1,id2){return function(){o._sync(id1,id2);};})(this, arguments[i], arguments[i+1]);
    31.       document.getElementById(arguments[0]).onchange();//запускаем обработчик onchange первого селекта, чтобы при загрузке страницы заполнить дочерние селекты значениями.
    32.   }
    33.   //служебный метод _sync - срабатывает при смене выбранного элемента в текущем (старшем) элементе SELECT (по его событию onChange) и изменяет содержимое зависимого селекта на основании значения выбранного в старшем селекте.
    34.   syncList.prototype._sync = function (firstSelectId, secondSelectId)
    35.   {
    36.       var firstSelect = document.getElementById(firstSelectId);
    37.       var secondSelect = document.getElementById(secondSelectId);
    38.  
    39.       secondSelect.length = 0; //обнуляем второй (подчиненный) SELECT
    40.      
    41.       if (firstSelect.length>0)//если первый (старший) SELECT не пуст
    42.       {
    43.           //из свойства dataList, с данными для заполнения подчиненных селектов, берем ту часть данных, которая соответствует именно значению элемента,
    44.           //выбранного в первом селекте, и определяет содержимое подчиненного элемента SELECT.
    45.           var optionValue = firstSelect.options[ firstSelect.selectedIndex==-1 ? 0 : firstSelect.selectedIndex].value; var optionData = this.dataList[optionValue]; if (!optionData) optionData = this.dataList[parseInt(optionValue)];
    46.           //заполняем второй (подчиненный) селект значениями (создаем элементы option)
    47.           for (var key in optionData || null) secondSelect.options[secondSelect.length] = new Option(optionData[key], key);
    48.        
    49.          //если в старшем SELECT-е нет выделенного пункта, выделяем первый
    50.           if (firstSelect.selectedIndex == -1) setTimeout( function(){ firstSelect.options[0].selected = true;}, 1 );
    51.           //если во втором списке нет выделенного пункта, выделяем первый его пункт
    52.           if (secondSelect.length>0) setTimeout( function(){ secondSelect.options[0].selected = true;}, 1 );
    53.       }
    54.       //если второй (подчиненный) селект имеет в свою очередь свои подчиненные селекты (те, для которых он главный),
    55.       //то запускаем его обработчик onchange, чтобы изменить его подчиненные селекты
    56.       secondSelect.onchange && secondSelect.onchange();
    57.   };
    58.   </script>
    59. </head>
    60. <body> ';
    61.  
    62.  
    63.    
    64.    $result = mysql_query ("SELECT * from pages") or die (mysql_error());
    65.    $mrow = mysql_fetch_array($result);
    66.    echo '<select id="action" name="action" size="10" >';
    67.    do
    68.    {
    69.     echo "<option value=".$mrow['id'].">".$mrow['title']."</option>";
    70.    }
    71.    while ($mrow = mysql_fetch_array($result));
    72.    echo '</select>';
    73. echo '   <select size="10" id="ok" name="ok"></select>';
    74.  
    75.    '
    76. <!-- либо делаем меню ручками, по принципу: -->
    77. <br /><br />
    78.  
    79. '.stripslashes($row['body']).'
    80. </body>
    81. </html> ';
    82. ?>
    Можно ли сделать как то так как на рисунке?
    [​IMG]
    Создать кнопку при нажатии которой переводится элемент из первого списка во второй?
    Кто знает как это сделать? Подскажите пожалуйста. [/img]
     
  10. gkhelloworld

    gkhelloworld Активный пользователь

    С нами с:
    18 ноя 2007
    Сообщения:
    311
    Симпатии:
    0
    Адрес:
    PHP.ru
    Реализация на PHP + jQuery c JSON

    Задача: 2 таблицы, каталог, саб каталоги пришпиленные к каталогу, 2 select'а, нажимаем на один или несколько в select "каталоги" в select "саб-каталоги" закидывается список саб каталогов от выбранных вами "каталогов"
    Заранее изменяюсь я не сильно умею изъясняться "по русски"
    Вот картинка =) лучше один раз увидеть...
    [​IMG]

    [js] $('select[name="company_catalog[]"]').change(function (){
    var cid = $(this).val();
    $.ajax({
    type:"POST",
    url:"subcatatalogs.php",
    data:{"company_catalog[]": cid},
    dataType:'json',
    success: function(data)
    {
    $('select[name="company_subcat[]"]').empty();
    $.each(data.items, function(i,item)
    {
    $('select[name="company_subcat[]"]').append('<option value="'+item.value+'">'+item.name+'</option>');
    });
    }
    });
    });[/js]

    subcatatalogs.php

    PHP:
    1. <?php
    2.  $cidx = $_POST['company_catalog'];
    3.  if (is_array($cidx))
    4.  { 
    5.     $sql = "SELECT * FROM `il_company_subcat` WHERE `cid` IN (";
    6.     foreach ($cidx as $cid)
    7.     {
    8.        $sql .=  $cid.',';
    9.     }
    10.    $sql = substr($sql, 0, -1);
    11.    $sql .= ") ORDER by `cid` AND `name` DESC;";
    12.    $result = '{"items":[';
    13.  
    14. // Закидываем $sql в БД
    15.    $query = $this->db->query($sql);
    16.    
    17.    foreach ($query->result() as $row)
    18.    {
    19.        $catalog = $this->Msubmit->get_company_catalog($row->cid);
    20.        $result .= '{"value": "'.$row->scid.'", "name": "'.$catalog->name.' &rarr; '.$row->name.'"},';
    21.     }
    22.  
    23.    $result = substr($result, 0, -1);
    24.    $result .= ']}';
    25.    echo $result;
    26.     }
    27.     else
    28.     {
    29.     echo '{
    30. "items": [
    31.        {
    32.              "value": "0",
    33.              "name": "-----"
    34.           }
    35.       ]
    36.   }';
    37.  }
    38. ?>
    Всё очень просто и легко..
     
  11. Alexej28

    Alexej28 Активный пользователь

    С нами с:
    22 июн 2006
    Сообщения:
    20
    Симпатии:
    0
    Привет всем. Спасайте. Нужны динамические селекты, которые зависят друг от друга. Тоесть без строгой иерархии, как написано в первом сообщении. Там второй селект реагирует только на действия первого. А мне нужно чтобы из 20 допустим каждый реагировал на действия каждого. Напишу пример, для более точной картины.
    Итак: 20 селектов, в каждый из БД выбирается по 27 имён. Я выбираю допустим в 10 селекте, имя номер 5. В остальных селектах это имя должно исчезнуть, чтобы его невозможно было выбрать второй раз. Если же я выбранное имя возвращаю на пустой селект, это имя появляется во всех селектах снова.
    Надеюсь понятно выразился.
    Сам пытался переделать этот скрипт что вначале написал, пробовал с ajax, пока результатов не добился.
    Заранее огромное спасибо.
     
  12. Your

    Your Старожил

    С нами с:
    2 июл 2011
    Сообщения:
    4.074
    Симпатии:
    7
    Ой говно кода - то!!! на сервере со скрытыми файлами слабо!? ;)

    без ./userlive.php? подобного говна!
     
  13. igordata

    igordata Суперстар
    Команда форума Модератор

    С нами с:
    18 мар 2010
    Сообщения:
    32.408
    Симпатии:
    1.768
    Your
    Ой говно кода, то!!!
    в данном случае "то" пишется через дефис :D
     
  14. Your

    Your Старожил

    С нами с:
    2 июл 2011
    Сообщения:
    4.074
    Симпатии:
    7
    ага, поправил :)
     
  15. Centrovoy

    Centrovoy Новичок

    С нами с:
    4 фев 2014
    Сообщения:
    2
    Симпатии:
    0
    Пишу виджет для Wordpress.

    Нужно сделать 3 выпадающих списка. (их я уже сделал)

    Но сначала нужно выбрать в первом списке марку авто, после чего во втором должны появиться модели данной марки, после выбора которых в 3-м выпадающем списке появятся модификации.

    Код (Text):
    1.  
    2. <?php
    3. echo "<form id='myform' method='get' action=''>
    4. <select id='manuf' name='manuf'>
    5. <option value=''>Выбрать...</option>";
    6.                 $query = mysql_query("SELECT id,brand FROM tof_manufacturers ORDER BY brand");
    7.                 $result = mysql_fetch_array($query);
    8.  
    9.                 do
    10.                 {
    11.                 echo "<option value='".$result['id']."'>".$result['brand']."</option>";
    12.                 }
    13.                 while($result = mysql_fetch_array($query));
    14.  
    15. echo "</select><br><br>";
    16.  
    17. echo "<select id='model' name='model'>
    18. <option value=''>Выбрать...</option>";
    19.                 $query1 = mysql_query("SELECT id,description FROM tof_models WHERE manufacturer_id=504");
    20.                 $result1 = mysql_fetch_array($query1);
    21.  
    22.                 do
    23.                 {
    24.                 echo "<option value='".$result1['id']."'>".$result1['description']."</option>";
    25.                 }
    26.                 while($result1 = mysql_fetch_array($query1));
    27.  
    28. echo "</select><br><br>";
    29.  
    30. echo "<select id='god' name='god'>
    31. <option value=''>Выбрать...</option>";
    32.                 $query1 = mysql_query("SELECT capacity,start_date,end_date FROM tof_types WHERE model_id=24 GROUP BY capacity,start_date,end_date");
    33.                 $result1 = mysql_fetch_array($query1);
    34.  
    35.                 do
    36.                 {
    37.                 echo "<option value='".$result1['id']."'>".$result1['capacity']." (".$result1['start_date']."-".$result1['end_date'].")</option>";
    38.                 }
    39.                 while($result1 = mysql_fetch_array($query1));
    40.  
    41. echo "</select>";
    42.  
    43. echo "</form>";
    44. ?>
    Вместо 504 должна быть какае-то переменная, переданная из 1-го селекта после выбора.
    Вместо 24 должна быть какае-то переменная, переданная из 2-го селекта после выбора.

    Как эту задачу реализовать?
    Сайт: http://autotime.by/

    С JS совсем не дружу... Догадываюсь что через AJAX нужно делать, но тут я полный профан.
     
  16. igordata

    igordata Суперстар
    Команда форума Модератор

    С нами с:
    18 мар 2010
    Сообщения:
    32.408
    Симпатии:
    1.768
    И чего вы хотите? Потратьте 10 минут на изучение Аякса для начала :D
     
  17. Centrovoy

    Centrovoy Новичок

    С нами с:
    4 фев 2014
    Сообщения:
    2
    Симпатии:
    0
    Хочу понять как этот аякс работает, в двух словах.
    В каком направлении копать.
    По каким запросам гугл мучать.

    Может какой пример для быстрейшего понимания.

    10 минут ушло только на прочтение статьи на википедии.
    А что-бы полностью разобраться с JS уйдёт как минимум месяц свободного времени, которого к сожалению нет
     
  18. igordata

    igordata Суперстар
    Команда форума Модератор

    С нами с:
    18 мар 2010
    Сообщения:
    32.408
    Симпатии:
    1.768
    JQuery Ajax, копируете пример, вешаетесь на событие и готово.
     
  19. poberezhniy

    poberezhniy Новичок

    С нами с:
    28 май 2014
    Сообщения:
    3
    Симпатии:
    0
    Люди помогите решить вопрос! Я в Ajax новичок и ничего еще не смыслю, а обойтись без него не смогу.
    Как решить вот такой вопрос?
    Есть таблица в MySQL с полями ( | id(key) |, | kolodec |,| arm1 |, | arm2 |, | arm3 |, | arm4 |, | arm5 |, | arm6 |, | arm7 |, | arm8 | ),
    Есть 2 меню <form><Select><?php include ("armatura.php"); ?></Select><Select></Select></form>.
    В первый селект я подключил файл-скрипт (armatura.php), вот его содержимое:
    -------------------------------------------------------------------------------------------------------------------------------------------------------------
    Armatura.php
    -------------------------------------------------------------------------------------------------------------------------------------------------------------
    <?php
    include ("base.php");
    $result= mysql_query("SELECT kolodec FROM armatura", $connect);
    while ($row = mysql_fetch_object($result))
    {
    echo '<option value="' . $row->kolodec . '"';
    if ($selected == $row->kolodec) echo 'selected';
    echo ">" . $row->kolodec . "</option>";
    };
    mysql_close($connect);
    ?>
    --------------------------------------------------------------------------------------------------------------------------------------------------------------

    Этот скрипт выводит в первый <select> поле "kolodec".
    как сделать что бы во втором <select> выводились данные полей (| arm1 |, | arm2 |, | arm3 |, | arm4 |, | arm5 |, | arm6 |, | arm7 |, | arm8 |), в зависимости выбраного колодца.

    вот скрин таблицы:

    https://docs.google.com/file/d/0B80ob0nH8umNWjFOQTZyMDBFZEU/edit
     
  20. Fell-x27

    Fell-x27 Суперстар
    Команда форума Модератор

    С нами с:
    25 июл 2013
    Сообщения:
    12.156
    Симпатии:
    1.770
    Адрес:
    :сердА
    Точно так же. Получить данные и, в цикле, собрать из них селект. И таки при чем тут аякс?
     
  21. poberezhniy

    poberezhniy Новичок

    С нами с:
    28 май 2014
    Сообщения:
    3
    Симпатии:
    0
    повторюсь! я только начинающий.
    html, css, - знаю отлично
    php, MySQL - начал учить

    И мне вот подсказали что эту задачу можно решить с помощью Ajax.

    так делаю и мне вываливается список только одного из столбцов.....
    в мне нужно что бы выдавало все столбцы.
    пример

    Выбрал К1 и мне выдало во втором селекте его Arm1, Arm2,
    или
    Выбрал К10 и мне выдало во втором селекте его Arm1, Arm2, Arm3, Arm4, Arm5, Arm6,
     
  22. smitt

    smitt Старожил

    С нами с:
    3 янв 2012
    Сообщения:
    3.166
    Симпатии:
    65
    1. В первом селекте выбираешь элемент.
    Javascript-ом получаешь это значение.
    2. Аяксом посылаешь запрос на сервер. Делаешь выборку из базы. Создаешь html селект.
    3. Возвращаешь полученный селект и вставляешь в html

    http://api.jquery.com/jquery.post/
     
  23. poberezhniy

    poberezhniy Новичок

    С нами с:
    28 май 2014
    Сообщения:
    3
    Симпатии:
    0
    Не отрабатывает $.Post

    вот код:

    <script>
    $(document).ready(function()
    {
    $('#kolodec').change(function()
    {
    $.post( 'otpravka.php', function(data)
    {
    $("#armmat").html(data);
    });
    });
    });
    </script>

    В файле "otpravka.php"
    код такого плана:

    <?php
    echo ('Отлично! Ваш текст выведен на экран');
    ?>

    как сделать что бы пост отработал?
     
  24. vitalya88

    vitalya88 Новичок

    С нами с:
    24 апр 2014
    Сообщения:
    5
    Симпатии:
    0
    Ребят подскажите, есть пару селектов которые строятся с БД. Хочу сделать чтобы при выборе первого селекта во втором отображались не все возможные поля с БД, а определенные для первого селекта. Возможно ли данный код заюзать для этого?
     
  25. redcass

    redcass Новичок

    С нами с:
    16 фев 2015
    Сообщения:
    27
    Симпатии:
    0
    Всем привет, сталкнулся с проблемой!
    есть вот ето


    Код (Text):
    1.  <label>Регион</label>
    2.                 <select type="text" class="inplaceError" id="region_id" name="region_id" value="" />
    3.                     <option value="0"></option>
    4.                     <option value="4052">Краснодарский край</option>
    5.                     <option value="4800">Ростовская область</option>
    6.                 </select>
    а так же есть php скрипт

    Код PHP

    Код (Text):
    1. <?php echo $userdata['region_id'];?>
    двигаемся далее...
    Хочу очень сделать так, чтобы select сработал автоматически!!
    в php скрипте находится код региона(сейчас там 4052)! Куда его поставить ума не сложу!


    по сути я хочу сделать по значению value="" автоматический выбор из опций
    где

    Код (Text):
    1. value="4052"   =    value="<?php echo $userdata['region_id'];?>"
    Код (Text):
    1.  
    2. <label>Регион</label>
    3.                 <select type="text" class="inplaceError" id="region_id" name="region_id" value="<?php echo $userdata['region_id'];?>" />
    4.                     <option value="0">-Выберите район-</option>
    5.                     <option value="4052">Краснодарский край</option>
    6.                     <option value="4800">Ростовская область</option>
    7.                 </select>
    ТАК НЕ РАБОТАЕТ!!! ПОЧЕМУ?(((

    Добавлено спустя 3 минуты 8 секунд:
    тут без js не обойтись?как можно рншить эту задачу?