JavaScript-сценарий для эмуляции "submit"

[Lutsk]

Прошу не судить строго, - в JavaScript я дилетант (пока), - просто помощь нужна.
Есть выпадающий список формы, - по задумке при выборе пользователем одного из <option> страница должна перегрузиться. Для этих целей прикрутил сценарий:

<script type="text/javascript" language="javascript">
function change (type){
	document.easearch.submit(); 
}
</script>

<select onchange="javascript:change(document.getElementById('type').selectedIndex);" class="makeMeFancy" id="type" name="type">
	<option class="inputbox" selected="selected" value="1">Опция 1</option>
	<option class="inputbox" value="2">Опция 2</option>
	<option class="inputbox" value="3">Опция 3</option>
</select>

Сценарий срабатывает, но дело в том, что, как всегда, для визуального оформления селектов используется скрипт и генерирует над селектом html список вида:

<ul class="srList srCollapsed srBlur">
	<li class="srSelectedLi">Опция 1</li>
	<li class="">Опция 2</li>
	<li>Опция 3</li>
</ul>
<select onchange="javascript:change(document.getElementById('type').selectedIndex);" class="makeMeFancy" id="type" name="type">
	<option class="inputbox" selected="selected" value="1">Опция 1</option>
	<option class="inputbox" value="2">Опция 2</option>
	<option class="inputbox" value="3">Опция 3</option>
</select>

Сам селект убирается из вида при помощи абсолютного позиционирования и свойства "left: -999em;".
Как сделать, чтоб функция change () срабатывала при клике по элементу списка <li></li>?

Спасибо.

[bes]

<form name="myForm">
<ul id="list" style="cursor: pointer">
  <li>Опция 1</li>
  <li>Опция 2</li>
  <li>Опция 3</li>
</ul>
<select id="sel" name="sel">
  <option value="1">Опция 1</option>
  <option value="2">Опция 2</option>
  <option value="3">Опция 3</option>
</select>
</form>

<script>
window.onload = function () {
  var list = document.getElementById('list');
  var sel = document.getElementById('sel');

  list.onclick = function(e) {
    e = e || event;
    var target = e.target || e.srcElement;
    if (target.tagName == 'LI') {
      var len = sel.options.length;
      for (var i = 0; i < len; i++) {
        if (target.innerHTML == sel.options[i].text) {
          sel.options[i].selected = true; 
          document.myForm.submit();
        }
      }
    }
  }

  sel.onchange = function () {
    document.myForm.submit();
  }

}

</script>

[Lutsk]

bes, да этот код рабочий. Но в моем случае что-то не хочет работать. Видимо, конфликт со скриптом есть...
А, понял. В коде ведь нету ID у списка <ul>.
Но если на странице не один список ul, - как тогда с id быть?

[lord2kim]

bes, да этот код рабочий. Но в моем случае что-то не хочет работать. Видимо, конфликт со скриптом есть...
А, понял. В коде ведь нету ID у списка <ul>.
Но если на странице не один список ul, - как тогда с id быть?

для каждого списка ul поставьте уникальный идентификатор id
или, если я вас не так понял, в цикле по всем ul на странице пробежаться с помощью getElementsByTagName("ul")

[bes]

Lutsk, всё зависит от ситуации, нужен рабочий пример.
Например, если список появляется чётко перед select-ом, то можно получить этот список как предыдущего соседа.
И, кстати, чтобы не делать проверку if (target.innerHTML == sel.options[i].text), можно найти номер пункта <li> (простого способа (без цикла) определить номер списка вроде нет), а потом установить selected для <option> c этим номером (я так понял, у вас список ul однозначно заменяет select).
Если у вас select-a вообще никогда не видно, то можно просто присваивать содержимое (innerHTML) пункта списка value input type="hidden".

[Lutsk]

Вот, для наглядности выложил пример сюда: http://hostsites.ru/select
В скрипте, который меняет селект на список, я добавил ul.id = 'list'. Но тогда и второму списку присваивается такой же id. А надо, к примеру, чтоб на перегрузку работал только первый.

[bes]

Я так понял, вы просто хотите заменить реальные селекты своими более красивыми, а реальные селекты используете лишь для отправки данных. Если это так так, то достаточно для каждого такого селекта по одному input type=hidden, при выборе значения присваиваете его value соответствующего input-а, данные отправятся (а такие сложности, на мой взгляд, ни к чему).

[Deff]

Lutsk Интерфейс - наворачивайте сколь угодно сложный(вне формы), но форма простейшая,
По перехваченному(или сгенеренному) событию submit
Переносить выбранные-заданные значение из навороченного интерфейса в input hidden как сказал bes выше
и только потом отправлять форму

[Lutsk]

Ну хорошо, допустим. Но как тогда быть с ul.id = 'list'? Надо как-то тогда присваивать его сугубо для списка, заменяющего select id="sel"...

[Deff]

Lutsk,
Хм - какие сложности - по клику на нужный пункт в ul - всовываете данные в input hidden - если пользователь передумал и кликнул - новые - опять всовываете в соответствующий input hidden
Задача считать данные, которые расположены прямо в кликабельном элементе на ul

типо <li data="Трям"> Трям </li>
атрибут data -считываем по клику и суем в input