Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Работа с выпадающим списком (SELECT) (https://javascript.ru/forum/misc/2882-rabota-s-vypadayushhim-spiskom-select.html)

Bogus 20.02.2009 20:35

Работа с выпадающим списком (SELECT)
 
Доброго времени суток всем. Мой вопрос может показатся кому то и ламерским но все же.

для начала кусок кода
<form method="get" action="./dir.php">
	<script language=javascript>var fil = ''</script>
		<div align="left">Новая характеристика 1</div>
			<SELECT name="filter1" style="margin-top: 5px;">
			  <option style="color: #AAAAAA" value="0">Выбрать »</option>
			  <option value="1">1!</option>
			  <option value="2">2!</option>
			  <option value="3">3!</option>
			</SELECT>
	<script language=javascript>
		if (this.filter1!=0) var fil=1
		document.write('<input type=hidden value='+fil+' name=filter>') 
	</script>
	<br>
	<input type="submit" value="Искать">
</form>


тоесть по логике выходит так, если значение filter1 равно 0 - то не происходит никаких действий, а если не равно то переменная fil равна 1

токо заморочка в том что по факту this.filter1 возвращает (как мне сказали) не значение а реплику undefined.

От сюда вопрос - как вытащить id активного пунтка из этого списка? (на всякий случай, списков в форме может быть несколько)

gcolor 20.02.2009 23:04

Попробуйте
this.options[this.selectedIndex].value;
Только у Вас скрипт не связан с Selectom!!!
Я так думаю :yes:

Bogus 21.02.2009 00:41

Цитата:

Сообщение от gcolor (Сообщение 13008)
Попробуйте
this.options[this.selectedIndex].value;
Только у Вас скрипт не связан с Selectom!!!
Я так думаю :yes:

ну от части Вы правы. смысл не в Select'e

если говорить о всей заморочке то мне на форме селектов надо сделать следующее

на основет тех пунтков каторый юзер выбирает в селектах нада сформировать еще один параметр формы (ясное дело он в хайдене), после чего все параметры выкинуть GET'ом. Но вот проблемка =) Логику вроде понимаю а по факту - руки матом.

папробывал как Вы показали, чето не выходит, простая хтмл в ИЕ ругается на то что объект НУЛЛ или не в ОБЪЕКТЕ.

ниже ложу сгенереный код всей Формы. Может я дето по ходу еще нафтыкал :(

<form method="get" action="./dir.php">
<script language=javascript>var fil = ''</script>

<div align="left"><span class="productSpecialPrice"><strong>характеристика 1</strong></span></div>
	<SELECT name="filter1" style="margin-top: 5px;">
	  <option style="color: #AAAAAA" value="0">Выбрать »</option>
	  <option value="1">1!</option>
	  <option value="2">2!</option>
	  <option value="3">3!</option>
	</SELECT>
<script language=javascript>
if (this.options[this.selectedIndex].value!=0) 
var fil=fil+'and1'
</script>

<div align="left"><span class="productSpecialPrice"><strong>характеристика 2</strong></span></div>
	<SELECT name="filter2" style="margin-top: 5px;">
	  <option style="color: #AAAAAA" value="0">Выбрать »</option>
	  <option value="5">весна</option>
	  <option value="6">лето</option>
	  <option value="7">осень</option>
	</SELECT>
<script language=javascript>
if (this.options[this.selectedIndex].value!=0) 
var fil=fil+'and2'
</script>

<div align="left"><span class="productSpecialPrice"><strong>характеристика 3</strong></span></div>
	<SELECT name="filter3" style="margin-top: 5px;">
	  <option style="color: #AAAAAA" value="0">Выбрать »</option>
	  <option value="8">упячга</option>
	  <option value="11">ебрило</option>
	</SELECT>
<script language=javascript>
if (this.options[this.selectedIndex].value!=0) 
var fil=fil+'and3'
</script>

<script language=javascript>
document.write('<input type="text" value="'+fil+'" name="filter">') 
</script>

	<input type=hidden value="" name="search_words">
<br>
    <input type="submit" value="Искать">
</form>

Андрей Параничев 21.02.2009 00:51

Bogus,
Скажите, что вы хотите сделать? Просто есть подозрение, что вы все делаете неправильно.

Bogus 21.02.2009 01:04

Цитата:

Сообщение от Андрей Параничев (Сообщение 13015)
Bogus,
Скажите, что вы хотите сделать? Просто есть подозрение, что вы все делаете неправильно.

если честно то я не удивлюсь если будет именно так.
Постараюсь изложить свое хотенее :p

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

теперь что я сделал: убрал этот редирект, согнал разные фильтры (списки) в одну форму, добавил пару полей hidden с доп параметрами каторые должны уходить вкуче со всем в GET запрос.

что не получается: один из параметров должен просто перечислять фильтры каторые были выбраны юзером (к примеру: filter=and1and2and3 каждый andN это отдельный параметр).

и вот как я подумал это провернуть, решил обьявить в начале формы переменную fil, а патом после каждого селекта проверяю чтобы id выбраного пункта небыл равен 0 (нулю), так как 0 это единственное значение каторое я могу указать сам и оно 100% не совпадет не с одним ID из движка. Если id пункта не равен нулю, значит юзер сделал выбор и значит параметр этого фильтра нужно добавить, соответсвенно обновляю переменную fil (var fil=fil+'andN').
После чего в конце формы скриптом вписываю нужное хайден поле и вставляю туда в value свою готовую переменную за счет чего и получаю полностью собраных GET запрос.

ток вот не пашит.


сори за много букв. старался как мог.

Андрей Параничев 21.02.2009 02:00

Bogus,
Тогда вы делаете неправильно. Дело в том, что JavaScript, в отличии от php, должен работать динамически. Т.е. работать, основываясь на событиях, происходящих в браузере, и изменять состояние уже сформированного документа.

Поэтому, вы не должны писать код "последовательно" и использовать конструкцию document.write, вы должны установить обработчик события submit формы, которое будет устанавливать необходимое значение hidden поля.

Вот один из примеров такой работы, просто я не смог вашу задачу понять до конца, поэтому не точно её решение:
<script type="text/javascript">
	// Описываем функцию, которая будет выполняться
	// при отправке формы:
	// form - ссылка на форму
	// filters - хеш фильтров и параметров
	function addFilters(form, filters) {
		// Получаем элемент нашего "фильтра"
		var filter_query = document.getElementsByName("filter")[0];
		
		// Очищаем:
		filter_query.value = "";
		
		// "Аналог" foreach из php:
		for (var i in filters) if (filters.hasOwnProperty(i)) {
			// Получаем фильтр по имени (первый элемент с таким именем):
			var filter = document.getElementsByName(i)[0];
			// Лучше делать проверку, что выбран не первый вариант:
			if (filter.selectedIndex > 0) {
				// Теперь добавляем нужный нам "параметр":
				filter_query.value += filters[i];
			}
		}
	}
</script>

<!-- 
	В форме указываем наш обработчик , первый параметр - форма,
	второй - хеш, в котором ключи - имена фильтров, а значения - 
	добавляемый в запрос параметр:
-->
<form method="get" onsubmit="addFilters(this, {'filter1':'and1', 'filter2':'and2'})" action="./dir.php">
        <div align="left">Новая характеристика 1</div>
            <SELECT name="filter1" style="margin-top: 5px;">
              <option style="color: #AAAAAA" value="0">Выбрать »</option>
              <option value="1">1!</option>
              <option value="2">2!</option>
              <option value="3">3!</option>
            </SELECT>
			
            <SELECT name="filter2" style="margin-top: 5px;">
              <option style="color: #AAAAAA" value="0">Выбрать »</option>
              <option value="1">1!</option>
              <option value="2">2!</option>
              <option value="3">3!</option>
            </SELECT>
    <br>
    <input type="hidden" name="filter" value="" />
    <input type="submit" value="Искать">
</form>

Bogus 21.02.2009 15:00

ну впринципе да, написать ф-ю это действительно выход. только вот поскольку содержимое формы может менятся в зависимости от кол-ва select'a то я не понимаю как мне передать все данные в форму

addFilters(this, {'filter1':'and1', 'filter2':'and2'}


я не смогу перечислить все фильтры в ф-и подобным образом если контент изменится (к примеру добавится еще один фильтр). так получается что я должен при каждом изменении формы редактировать вызов ф-и.


можно как то одним махом заслать абсолютно все переменные формы в ф-ю и там уже их перебирать и строить свой GET запрос?

Bogus 21.02.2009 15:33

думал если отправить в ф-ю всю форму то она уйдет туда массивом выбраных значений :( уже понял что уходит вся форма цеиком =)

скажите могу ли я как то определить кол-во елементов select в форме, ну и их имена заодно или чтонибуть чтобы нормально получать доступ к ним и их значениям?

или может можно как то отправить в форму масив данных?

Zibba 21.02.2009 16:34

Цитата:

Сообщение от Bogus
могу ли я как то определить кол-во елементов select в форме

var sel = document.body.getElementsByTagName('select');
sel.length;


Цитата:

Сообщение от Bogus
ну и их имена заодно

// имя первого select'а
sel[0].name;
// sel[1] - второго, sel[2] - третьего и т.д.


Цитата:

Сообщение от Bogus
чтонибуть чтобы нормально получать доступ к ним и их значениям

sel[0].value;// значение первого select'а и т.д. по аналогии с name


В общем в переменной sel будет храниться масив select'ов всей страницы, к свойствам, атрибутам и значениям которых вы имеете доступ.

Андрей Параничев 21.02.2009 16:47

Bogus,
А имена параметров и фильтров как-то связанны?


Часовой пояс GMT +3, время: 07:58.