Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 15.08.2010, 23:44
Интересующийся
Отправить личное сообщение для krol Посмотреть профиль Найти все сообщения от krol
 
Регистрация: 08.08.2010
Сообщений: 21

Как выбрать option если он есть в get переменной
Есть зависимые выпадаюшие списки:
<select name="cat" id="cat"> 
<option value="">Все категории</option>
<option value="1">Одежда</option>
<option value="2">Обувь</option>
</select>
<select id="size" name="size"></select>

есть массив:
<script type="text/javascript">

   var syncList1 = new syncList;
  syncList1.dataList =
  {
 '1': // Одежда
    {
	'':'Выбирите размер', 
    '1':'XS',
    '2':'S',
    '3':'M',
    '4':'L',
    '5':'XL',
    '6':'XXL'
    }, 	
	
   '2': // Обувь
    {
	'':'Выбирите размер',   
        '7':'38',
        '8':'39',
        '21':'40',
	'10':'41',
	'11':'42',
	'12':'43',
	'13':'44',
	'14':'45'

    }
	

	
  };
   syncList1.sync("cat","size"); // Синхронизация списков
  </script>

Вопрос как после загрузки страницы выделить option если он есть в get переменной?

Последний раз редактировалось krol, 15.08.2010 в 23:46.
Ответить с цитированием
  #2 (permalink)  
Старый 16.08.2010, 18:07
Интересующийся
Отправить личное сообщение для GreatRash Посмотреть профиль Найти все сообщения от GreatRash
 
Регистрация: 28.10.2009
Сообщений: 11

А как выглядит get-переменная? Может select.selectedIndex = номер_option'а?
Ответить с цитированием
  #3 (permalink)  
Старый 18.08.2010, 21:26
Интересующийся
Отправить личное сообщение для krol Посмотреть профиль Найти все сообщения от krol
 
Регистрация: 08.08.2010
Сообщений: 21

Я наверное ни так выразился мне нужно сделать так что бы если например в адресной строке есть GET_переменные cat=1&size=3 то в первом SELECTе будет отображаться Одежда, а во втором размер M выбор первого SELECTа выводится и так движком правильно, а вот с размерами выводится первый который есть в массиве
Ниже полный код:
<script type="text/javascript">
 function syncList()
  {
  }
  
  //Метод sync() - принимает список из значений атрибутов id элементов SELECT, образующих связанный список и запускает их синхронизацию
  syncList.prototype.sync = function()
  {
      //Перебираем аргументы (id элементов SELECT) и назначаем событиям onChange селектов, с соответствующими id, функцию-обработчик.
      //В качестве обработчика выступает второй метод объекта syncList - _sync (напрямую его вызывать не нужно)
      //Обработчик назначается всем элементам SELECT кроме последнего в списке аргументов, т.к. последний не влияет ни на какой другой элемент SELECT и с ним не нужно синхронизироваться.
      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]);
      document.getElementById(arguments[0]).onchange();//запускаем обработчик onchange первого селекта, чтобы при загрузке страницы заполнить дочерние селекты значениями.
  }
  //служебный метод _sync - срабатывает при смене выбранного элемента в текущем (старшем) элементе SELECT (по его событию onChange) и изменяет содержимое зависимого селекта на основании значения выбранного в старшем селекте.
  syncList.prototype._sync = function (firstSelectId, secondSelectId)
  {
      var firstSelect = document.getElementById(firstSelectId);
      var secondSelect = document.getElementById(secondSelectId);
  
      secondSelect.length = 0; //обнуляем второй (подчиненный) SELECT
     
      if (firstSelect.length>0)//если первый (старший) SELECT не пуст
      {
          //из свойства dataList, с данными для заполнения подчиненных селектов, берем ту часть данных, которая соответствует именно значению элемента,
          //выбранного в первом селекте, и определяет содержимое подчиненного элемента SELECT.
          var optionValue = firstSelect.options[ firstSelect.selectedIndex==-1 ? 0 : firstSelect.selectedIndex].value; var optionData = this.dataList[optionValue]; if (!optionData) optionData = this.dataList[parseInt(optionValue)];
          //заполняем второй (подчиненный) селект значениями (создаем элементы option)
          for (var key in optionData || null) secondSelect.options[secondSelect.length] = new Option(optionData[key], key);




          //если в старшем SELECT-е нет выделенного пункта, выделяем первый
         
	  if (firstSelect.selectedIndex == -1) setTimeout( function(){ firstSelect.options[0].selected = true;}, 1 );





// вытаскиваем GET_переменную size
var url = document.location.href;
var getsize = url.match(/size=(\w+)&/i)[1];  
		  //если переменная GET существует то выбираем пукт равный ей
      if (secondSelect.length==getsize) setTimeout( function(){ secondSelect.options[getsize].selected = true;}, 1 );


		  
          //если во втором списке нет выделенного пункта, выделяем первый его пункт
      if (secondSelect.length>0) setTimeout( function(){ secondSelect.options[0].selected = true;}, 1 );
      }
      //если второй (подчиненный) селект имеет в свою очередь свои подчиненные селекты (те, для которых он главный),
      //то запускаем его обработчик onchange, чтобы изменить его подчиненные селекты
      secondSelect.onchange && secondSelect.onchange();
  };



   </script>
<select name="cat" id="cat">
<option value="">Все категории</option>
<option value="1">Одежда</option>
<option value="2">Обувь</option>
</select>
<select id="size" name="size"></select>

<script type="text/javascript">
	 
	   var syncList1 = new syncList;
	  syncList1.dataList =
	  {
	 '1': // Одежда
	    {
	    '':'Выберите размер',
	    '1':'XS',
	    '2':'S',
	    '3':'M',
	    '4':'L',
	    '5':'XL',
	    '6':'XXL'
	    }, 
	     
	   '2': // Обувь
	    {
	    '':'Выберите размер',  
	    '7':'38',
	    '8':'39',
	    '21':'40',
	    '10':'41',
	    '11':'42',
	    '12':'43',
	    '13':'44',
	    '14':'45'
           };
	   syncList1.sync("cat","size"); // Синхронизация списков
	  </script>

С 42 строки по 46 я пытался дописать функцию но не вышло, кто нибуть подскажет что не правильно?

Последний раз редактировалось krol, 18.08.2010 в 21:29.
Ответить с цитированием
  #4 (permalink)  
Старый 19.08.2010, 11:36
Интересующийся
Отправить личное сообщение для GreatRash Посмотреть профиль Найти все сообщения от GreatRash
 
Регистрация: 28.10.2009
Сообщений: 11

Ну можно при помощи location.search получить строку запроса из урла, например регуляркой найти нужную переменную и ее значение, а потом, исходя из полученных данных, уже действовать так как нужно.
Ответить с цитированием
  #5 (permalink)  
Старый 20.08.2010, 18:07
Интересующийся
Отправить личное сообщение для krol Посмотреть профиль Найти все сообщения от krol
 
Регистрация: 08.08.2010
Сообщений: 21

В том то и дело что значение я нашел
var url = document.location.href;
var getsize = url.match(/size=(\w+)&/i)[1];


Но вот не могу составить правильное условие. Мне ещё нужно сделать так что бы размер устанавливался только один раз при обновлении страницы (если он конечно есть в переменной).
Тоесть если я например потом выберу другое значение в первом SELECTе то он бы устанавливался на первое значение выбранного массива.
Ответить с цитированием
  #6 (permalink)  
Старый 21.08.2010, 22:10
Аватар для Gozar
Отправить личное сообщение для Gozar Посмотреть профиль Найти все сообщения от Gozar
 
Регистрация: 07.06.2007
Сообщений: 7,504

не называйте объекты массивами, из-за вашей каши невозможно понять что вы хотите. Начнем с того, что: syncList1.dataList - это объект.
Ответить с цитированием
  #7 (permalink)  
Старый 23.08.2010, 13:22
Интересующийся
Отправить личное сообщение для GreatRash Посмотреть профиль Найти все сообщения от GreatRash
 
Регистрация: 28.10.2009
Сообщений: 11

getsize у вас получается строка, а вам нужно число. Значит сравнивать в условии надо так: if (secondSelect.length == parseInt(getsize)).

Gozar, ну это типа ассоциативный массив.
krol, кстати, можно было б и просто массивом обойтись, раз уж индексы числовые.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Как получить ширину таблицы в пикселях, если в HTML она указана в процентах JackM Общие вопросы Javascript 2 13.02.2009 10:15
Проблема onmouseout если есть вложенные теги... AlexPa Общие вопросы Javascript 5 27.01.2009 19:59
активное textarea если есть галочка в radio ydv Events/DOM/Window 1 25.09.2008 16:24
Как узнать свернуто окно браузера или нет. bar-boss Events/DOM/Window 3 25.09.2008 16:09
Как сравнить класс, если их много!? Sc@M Events/DOM/Window 16 29.08.2008 12:47