Модераторы: Sardar, Aliance

Поиск:

Ответ в темуСоздание новой темы Создание опроса
> Форма для отправки данных на сервер с условиями! Поле select №2 должно иметь два варианта 
:(
    Опции темы
Гриша
  Дата 14.6.2005, 03:43 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


НУС(незнаю|узнаю|создаю)
*


Профиль
Группа: Участник
Сообщений: 181
Регистрация: 12.6.2005
Где: Земля, Москва, Хр ущевка

Репутация: нет
Всего: 1
Я случайно как-то создал две темы одинаковые, эту не удаляйте (модераторы) пожалуйста, удалите ту которая без знака вопроса. Я сам не могу удаить чего-то.

Помогите пожалуйста сделать форму для отправки даннх, с описанными ниже условиями.

1. Есть форма для отправки данных (например):
Код

<form name="form1" id="form1" method="get" action="/get_order/cart.php">


<br><a href="javascript:document.getElementById('form1').submit();">Отправить<a/>
</form>


2. В форме есть два ниспадающих меню. Одно меню всегда такое (меню 1):
Код

<select name="razmer" size="1">
<option value="small">размер детский</option>
<option value="big">размер взрослый</option>                                                                           
</select>


3. Второе меню (меню 2) должно меняться в зависимости от выбора.
Если в меню 1 выбрать пункт "размер детский", то меню 2 будет таким (вариант 2-1):
Код

<select name="new" size="1">
<option value="r1">размер 1</option>
<option value="r2">размер 2</option>                                       
<option value="r3">размер 3</option>
</select>


Если в меню 1 выбрать пункт "размер взрослый", то меню 2 будет таким (вариант 2-2):
Код

<select name="new" size="1">
<option value="r4">размер 4</option>
<option value="r5">размер 5</option>                                       
<option value="r6">размер 6</option>
</select>


4. На сервер должны отправляться данные методом get только из меню 2, т.е. значения name="new" и value=r1 или r2 или r3 или r4 или r5 или r6.
А значения name="razmer" и value=small или big; из меню 1 не должны отправляться,
возможно меню 1 должно быть таким:
<select size="1">
<option>размер детский</option>
<option>размер взрослый</option>
</select>

У меня есть один похожий код javascript, попробую с ним разобраться и днем вылажить, если что получиться.

Это сообщение отредактировал(а) Гриша - 14.6.2005, 03:55
--------------------
Если долго мучиться, что-нибудь получитЬся.
PM MAIL WWW   Вверх
Ciber SLasH
Дата 14.6.2005, 05:00 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Эксперт
***


Профиль
Группа: Участник Клуба
Сообщений: 1813
Регистрация: 9.11.2004
Где: С.-Петербург

Репутация: 24
Всего: 67
Оно ?
Код

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta HTTP-EQUIV=Content-Type CONTENT='text/html; CHARSET=windows-1251'>
</head>

<body>
<form name="form1" id="form1" method="get" action="">

<select name="razmer" size="1" onChange="selectView(this);">
<option value="small">размер детский</option>
<option value="big">размер взрослый</option>
</select>

<select name="new1" size="1" style="display: none">
<option value="r1">размер 1</option>
<option value="r2">размер 2</option>
<option value="r3">размер 3</option>
</select>

<select name="new2" size="1" style="display: none">
<option value="r4">размер 4</option>
<option value="r5">размер 5</option>
<option value="r6">размер 6</option>
</select>

<br><a href="javascript: makeLink();">Отправить<a/>
</form>

<script language='JavaScript'>
function selectView(obj) {
var val = obj.options[obj.selectedIndex].value;
var sel1_st = document.getElementById('form1').elements['new1'].style;
var sel2_st = document.getElementById('form1').elements['new2'].style;

  if (val == 'small') {
    sel1_st.display = '';
    sel2_st.display = 'none';
  }
  else {
    sel2_st.display = '';
    sel1_st.display = 'none';
  }
}

function makeLink() {
var fm = document.getElementById('form1');
var elem1 = fm.elements['new1'];
var elem2 = fm.elements['new2'];
var url = '/get_order/cart.php?';

  if (elem1.style.display == '')  url += 'name="new"&value='+elem1.options[elem1.selectedIndex].value;
  else if (elem2.style.display == '')  url += 'name="new"&value='+elem2.options[elem2.selectedIndex].value;
  location.href = url;
}
</script>
</body>
</html>
PM   Вверх
o.s.a.
Дата 14.6.2005, 05:20 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Xo4y B MocKBy
**


Профиль
Группа: Участник
Сообщений: 312
Регистрация: 16.2.2005
Где: Ташкент

Репутация: 5
Всего: 15
Ciber SLasH не мог бы ты пояснить как работает свойство display, и чем оно отличается от visibality?


--------------------
Не могу стоять, пока другие работают, пойду полежу.
PM MAIL ICQ   Вверх
Ciber SLasH
Дата 14.6.2005, 05:39 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Эксперт
***


Профиль
Группа: Участник Клуба
Сообщений: 1813
Регистрация: 9.11.2004
Где: С.-Петербург

Репутация: 24
Всего: 67
2o.s.a.:
  • Свойство visibility управляет видимостью генерируемого бокса.
    visible - Генерируемый бокс виден.
    hidden - Генерируемый бокс невидим (полностью прозрачен), но влияет на структуру.
  • Свойство display описывает, показывается ли элемент на холсте и каким образом.
    block - Элемент генерирует основной бокс блока.
    inline - Элемент генерирует один или более инлайн-боксов.
    list-item - Элемент (например, LI в HTML) генерирует основной бокс блока и инлайн-бокс элемента списка.
    none - Элемент не генерирует боксы в структуре форматирования (т.е. элемент не влияет на вид документа). Отображение 'none' не создаёт невидимый бокс; боксы вообще не создаются.

Фактически, для скрытия и показа блока можно применять и то и другое свойство (выбирай чё хош).

Более подробно смотри спецификацию CSS2, например вот тут: http://pyramidin.narod.ru/defmse.htm
PM   Вверх
o.s.a.
Дата 14.6.2005, 05:56 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Xo4y B MocKBy
**


Профиль
Группа: Участник
Сообщений: 312
Регистрация: 16.2.2005
Где: Ташкент

Репутация: 5
Всего: 15
Ciber SLasH спасибо за объяснение и за ссылку


--------------------
Не могу стоять, пока другие работают, пойду полежу.
PM MAIL ICQ   Вверх
Гриша
  Дата 14.6.2005, 12:57 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


НУС(незнаю|узнаю|создаю)
*


Профиль
Группа: Участник
Сообщений: 181
Регистрация: 12.6.2005
Где: Земля, Москва, Хр ущевка

Репутация: нет
Всего: 1
Спасибо большое Ciber SLasH.
Я сделал некоторые изменения:
1. Добавил в меню 1 пункт "выберите модель" и в меню 2 (во все варианты меню) пункт "Выберите размер"

2. Сделал, чтобы Меню 2 было видно всегда, но если в меню 1 ничего не выбрано, то в меню 2 должно быть только видно поле "Выберите размер", для этого сделал вариант 2-0 для меню 2:
Код

    <br><select name="new0" size="1" style="display: yes">
    <option>Выберите размер:</option>
    </select>


3. Изменил вот эти строки (чтобы после в строке браузера, после отправки были видны такие данные: .../get_order/cart.php?new=r1, т.е. передаются данные name равный new и value равный r1):
Код

  if (elem1.style.display == '')  url += 'new='+elem1.options[elem1.selectedIndex].value;
  else if (elem2.style.display == '')  url += 'new='+elem2.options[elem2.selectedIndex].value;
  location.href = url;


В ИТОГЕ ПОЛУЧИЛОСЬ ТАК:
Код

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta HTTP-EQUIV=Content-Type CONTENT='text/html; CHARSET=windows-1251'>
</head>

<body>
<form name="form1" id="form1" method="get" action="">

<select name="razmer" size="1" onChange="selectView(this);">
    <option>выберите модель:</option>
<option value="small">размер детский</option>
<option value="big">размер взрослый</option>
</select>

    <br><select name="new0" size="1" style="display: yes">
    <option>Выберите размер:</option>
</select>

    <br><select name="new1" size="1" style="display: none">
    <option value="0">Выберите размер:</option>
<option value="r1">размер 1</option>
<option value="r2">размер 2</option>
<option value="r3">размер 3</option>
</select>

    <br><select name="new2" size="1" style="display: none">
<option value="0">Выберит размер:</option>
<option value="r4">размер 4</option>
<option value="r5">размер 5</option>
<option value="r6">размер 6</option>
</select>

<br><a href="javascript: makeLink();">Отправить</a>
    </form>

<script language='JavaScript'>
<!--
function selectView(obj) {
var val = obj.options[obj.selectedIndex].value;
var sel0_st = document.getElementById('form1').elements['new0'].style;
var sel1_st = document.getElementById('form1').elements['new1'].style;
var sel2_st = document.getElementById('form1').elements['new2'].style;
 
  
  if (val == 'small') {
    sel0_st.display = 'none';
    sel1_st.display = '';
    sel2_st.display = 'none';    
  }
  else if (val == 'big') {
    sel0_st.display = 'none';
    sel1_st.display = 'none';
    sel2_st.display = '';   
  }
  else {
    sel0_st.display = '';
    sel1_st.display = 'none';
    sel2_st.display = 'none';
    }
}

function makeLink() {
var fm = document.getElementById('form1');
var elem1 = fm.elements['new1'];
var elem2 = fm.elements['new2'];
var url = '/get_order/cart.php?';

  if (elem1.style.display == '')  url += 'new='+elem1.options[elem1.selectedIndex].value;
  else if (elem2.style.display == '')  url += 'new='+elem2.options[elem2.selectedIndex].value;
  location.href = url;
}
-->
</script>
</body>
</html>


НО ПРОБЛЕМА В ТОМ, ЧТО ПРИ ВЫБОРЕ ИЗ МЕНЮ 1 НАПРИМЕР ПУНКТА РАЗМЕР ДЕТСКИЙ, МЕНЮ 2 СМЕЩАЕТСЯ ВНИЗ (НА УРОВЕНЬ <BR>), ПРИ ВЫБОРЕ ПУНКТА РАЗМЕР ВЗРОСЛЫЙ, ПУНКТ РАЗМЕР ВЗРОСЛЫЙ, МЕНЮ 2 СМЕЩАЕТСЯ ЕЩЕ ВНИЗ.
ПОМОГИТЕ ПОЖАЛУЙСТА ИСПРАВИТЬ ЭТУ НЕПРИЯТНОСТЬ?

Это сообщение отредактировал(а) Гриша - 14.6.2005, 12:59
--------------------
Если долго мучиться, что-нибудь получитЬся.
PM MAIL WWW   Вверх
Ciber SLasH
Дата 14.6.2005, 14:37 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Эксперт
***


Профиль
Группа: Участник Клуба
Сообщений: 1813
Регистрация: 9.11.2004
Где: С.-Петербург

Репутация: 24
Всего: 67
Можно сделать 2-мя путями (возможно есть ещё smile):
1) установи у SELECT'ов с именами new0-new2 класс, например class="sel"
перед </head> добавь стиль:
Код

<style>
.sel {position: absolute; top: 7%}
</style>

2) после 1-го SELECT'а вставь DIV и убери все скрытые SELECT'ы. А как нужно вывести скрытый SELECT, то через JS выводи его в DIV.

ЗЫ: свойство display по умолчанию установлено в block поэтому если не нужно скрывать элемент, то просто не пиши вообще это свойство в стиле. Т.е. то что ты написал style="display: yes" -- неверно, нужно вообще этот стиль убрать.
PM   Вверх
Гриша
Дата 14.6.2005, 15:06 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


НУС(незнаю|узнаю|создаю)
*


Профиль
Группа: Участник
Сообщений: 181
Регистрация: 12.6.2005
Где: Земля, Москва, Хр ущевка

Репутация: нет
Всего: 1
Спасибо Ciber SLasH. Я сделал так, в меню втором, все три варианта поставил друг за другом, без отступов и пробелов.
Т.е. заканчивается </select> и сразу на этойже строчке <select> (<select>...</select><select>..</select>)

Код

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta HTTP-EQUIV=Content-Type CONTENT='text/html; CHARSET=windows-1251'>
</head>

<body>
<form name="form1" id="form1" method="get" action="">

<select name="razmer" size="1" onChange="selectView(this);">
<option>выберите модель:</option>
<option value="small">размер детский</option>
<option value="big">размер взрослый</option>
</select>

   <p><select name="new0" size="1">
<option>Выберите размер:</option>
   </select><select name="new1" size="1" style="display: none">
<option>Выберите размер:</option>
<option value="r1">размер 1</option>
<option value="r2">размер 2</option>
<option value="r3">размер 3</option>
   </select><select name="new2" size="1" style="display: none">
<option>Выберит размер:</option>
<option value="r4">размер 4</option>
<option value="r5">размер 5</option>
<option value="r6">размер 6</option>
</select></p>

<p><a href="javascript: makeLink();">Отправить</a>
 </form>

<script language='JavaScript'>
<!--
function selectView(obj) {
var val = obj.options[obj.selectedIndex].value;
var sel0_st = document.getElementById('form1').elements['new0'].style;
var sel1_st = document.getElementById('form1').elements['new1'].style;
var sel2_st = document.getElementById('form1').elements['new2'].style;
 
  
  if (val == 'small') {
    sel0_st.display = 'none';
    sel1_st.display = '';
    sel2_st.display = 'none';    
  }
  else if (val == 'big') {
    sel0_st.display = 'none';
    sel1_st.display = 'none';
    sel2_st.display = '';   
  }
  else {
    sel0_st.display = '';
    sel1_st.display = 'none';
    sel2_st.display = 'none';
    }
}

function makeLink() {
var fm = document.getElementById('form1');
var elem1 = fm.elements['new1'];
var elem2 = fm.elements['new2'];
var url = '/get_order/cart.php?';

  if (elem1.style.display == '')  url += 'new='+elem1.options[elem1.selectedIndex].value;
  else if (elem2.style.display == '')  url += 'new='+elem2.options[elem2.selectedIndex].value;
  location.href = url;
}
-->
</script>
</body>
</html>


Подскажите, пожалуйста, как сделать так, что если например в меню 1 ничего не выбрано (или выбрано поле: выберите модель) или в меню 2 ничего не выбрано (или выбрано поле: Выберите размер), то при нажатии на ссылку отправить, данные отправляться небудут и выскочить окно предупреждения (например, с надписью вы выбрали не все поля!).

Это сообщение отредактировал(а) Гриша - 14.6.2005, 15:38
--------------------
Если долго мучиться, что-нибудь получитЬся.
PM MAIL WWW   Вверх
Ciber SLasH
Дата 14.6.2005, 15:23 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Эксперт
***


Профиль
Группа: Участник Клуба
Сообщений: 1813
Регистрация: 9.11.2004
Где: С.-Петербург

Репутация: 24
Всего: 67
Замени строку: location.href = url;
на:
Код

  if (url.indexOf('?') == url.length-1)  alert('Не выбрано значение !');
  else  location.href = url;
PM   Вверх
Гриша
Дата 14.6.2005, 15:41 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


НУС(незнаю|узнаю|создаю)
*


Профиль
Группа: Участник
Сообщений: 181
Регистрация: 12.6.2005
Где: Земля, Москва, Хр ущевка

Репутация: нет
Всего: 1
Ciber SLasH c этим кодом получается так, что если я выбиру что-нибудь в меню 1, то даже, есди в меню два ничего не выбраны, то все равно, идет отправка даннхы скрипту (хоть они и не выбраны.)
Как тут сделать, что если хоть в одлном меню не выбрано значение, то будет выводится сообщение об ошибки.

Вообще я щас проверяю, и получается, что когда во втором меню ничего не выбрано, а в первом выюрано, то alert то срабатывает, а то нет.

ПОЛУЧАЕТСЯ ТАК, ЧТО ЕСЛИ В МЕНЮ 1 ВЫБРАТЬ ПУНКТ ДЕТСКИЙ РАЗМЕР И НАЖАТЬ НА КНОПКУ ОТПРАВИТЬ, ТО ВЫСКОЧИТЬ СООБЩЕНИЕ О ТОМ, ЧТО ЗНАЧЕНИЕ НЕ ВЫБРАНО, А ЕСЛИ ПОСЛЕ ЭТОГО ВЫБРАТЬ, ПУНКТ РАЗМЕР ВЗРОСЛЫЙ, ТО ИДЕТ ОТСЫЛКА ДАННЫХ НА СЕРВЕР, Т.Е. ALERT НЕ СРАБАТЫВАЕТ.

Это сообщение отредактировал(а) Гриша - 14.6.2005, 15:47
--------------------
Если долго мучиться, что-нибудь получитЬся.
PM MAIL WWW   Вверх
Ciber SLasH
Дата 14.6.2005, 15:49 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Эксперт
***


Профиль
Группа: Участник Клуба
Сообщений: 1813
Регистрация: 9.11.2004
Где: С.-Петербург

Репутация: 24
Всего: 67
Тогда так...
замени:
Код

 if (url.indexOf('?') == url.length-1)  alert('Не выбрано значение !');

на:
Код

if (url.indexOf('?') == url.length-1 || url.indexOf('=') == url.length-1)  alert('Не выбрано значение !');
PM   Вверх
Гриша
Дата 14.6.2005, 15:57 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


НУС(незнаю|узнаю|создаю)
*


Профиль
Группа: Участник
Сообщений: 181
Регистрация: 12.6.2005
Где: Земля, Москва, Хр ущевка

Репутация: нет
Всего: 1
Ciber SLasH с таким кодом получается так, что даже если я и выбиру, что-то во втором меню, то всеравно выскакивает alert, а если я ничего не выберу во 2 меню, то иногда получается так, что выбрав в меню1 пункт размер детский, отправка данных идет все равно.


ЩАС ЕЩЕ РАЗ ВСЕ ПОСТАВИЛ, В ИТОГЕ ПОЛУЧАЕТСЯ ТАК. ЧТО ВСЕРАВНО ПОЛУЧАЕТСЯ ИНОГДА, ВЫБРАВ ПУНКТЫ ТОЛЬКО В 1 МЕНЮ, НИЧЕГО НЕ ВЫБИРАТЬ ВО ВТОРОМ И КНОПКА ОТПРАВИТЬ РАБОТАЕТ ВСЕ РАВНО.

Это сообщение отредактировал(а) Гриша - 14.6.2005, 16:01
--------------------
Если долго мучиться, что-нибудь получитЬся.
PM MAIL WWW   Вверх
Ciber SLasH
Дата 14.6.2005, 16:04 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Эксперт
***


Профиль
Группа: Участник Клуба
Сообщений: 1813
Регистрация: 9.11.2004
Где: С.-Петербург

Репутация: 24
Всего: 67
Проверь ещё раз, у меня таким образом всё работает:
Код

function makeLink() {
var fm = document.getElementById('form1');
var elem1 = fm.elements['new1'];
var elem2 = fm.elements['new2'];
var url = '/get_order/cart.php?';
  if (elem1.style.display == '')  url += 'new='+elem1.options[elem1.selectedIndex].value;
  else if (elem2.style.display == '')  url += 'new='+elem2.options[elem2.selectedIndex].value;
  if (url.indexOf('?') == url.length-1 || url.indexOf('=') == url.length-1)  alert('Не выбрано значение !');
  else  location.href = url;
}
PM   Вверх
Гриша
Дата 14.6.2005, 16:16 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


НУС(незнаю|узнаю|создаю)
*


Профиль
Группа: Участник
Сообщений: 181
Регистрация: 12.6.2005
Где: Земля, Москва, Хр ущевка

Репутация: нет
Всего: 1
ДА, ВСЕ РАБОТАЕТ, СПАСИБО БОЛЬШОЕ.
Я ПОНЯЛ ЧТО БЫЛО НЕ ТАК.

У МЕНЯ ЕЩЕ ОДИН ВОПРОС ОСТАЛСЯ ТОЛЬКО:
можно ли так сделать, чтобы если в меню 1 ничего не выбрано, то в меню два, вместо варианта 2-0, пунката Выберите размер, было пустое поле, но, чтобы ширина меню, была такой же, как и с пунктом Выберит размер.
--------------------
Если долго мучиться, что-нибудь получитЬся.
PM MAIL WWW   Вверх
Ciber SLasH
Дата 14.6.2005, 16:25 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Эксперт
***


Профиль
Группа: Участник Клуба
Сообщений: 1813
Регистрация: 9.11.2004
Где: С.-Петербург

Репутация: 24
Всего: 67
Код

<select name="new1" size="1" style="width: 145px; display: none">
<option></option>


Это сообщение отредактировал(а) Ciber SLasH - 14.6.2005, 16:26
PM   Вверх
Ответ в темуСоздание новой темы Создание опроса
Форум для вопросов, которые имеются в справочниках, но их поиск вызвал затруднения, или для разработчика требуется совет или просьба отыскать ошибку. Напоминаем: 1) чётко формулируйте вопрос, 2) приведите пример того, что уже сделано, 3) укажите явно, нужен работающий пример или подсказка о том, где найти информацию.
 
0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема | JavaScript: Общие вопросы | Следующая тема »

Подписаться на тему | Подписка на этот форум | Скачать/Распечатать тему


 




[ Время генерации скрипта: 0.1141 ]   [ Использовано запросов: 22 ]   [ GZIP включён ]


Реклама на сайте     Информационное спонсорство

 
 По вопросам размещения рекламы пишите на vladimir(sobaka)vingrad.ru
Отказ от ответственности     Powered by Invision Power Board(R) 1.3 © 2003  IPS, Inc.