Выберите опцию не получает значение

У меня есть раскрывающийся список, например, занятий, а когда пользователь нажимает кнопку «Другое», появляется текстовое поле, и пользователь должен будет указать свое занятие. Часть, в которой пользователь выбирает «Другое» и вводит свои занятия, сохраняет то, что он вводит, но когда пользователь собирается просто выбрать или выбрать из выпадающего списка, значение не записывается при отправке формы.Выберите опцию не получает значение

Как получить значение из опции выбора? Потому что я получаю только значение, когда пользователь выбирает «Другое» и вводит свое занятие. Вот мой код.

function CheckOccupation(val){ 
 
var element=document.getElementById('occupation'); 
 
if(val=='Other') 
 
    element.style.display='block'; 
 
else 
 
    element.style.display='none'; 
 
}

<select class="form-control" name="occupation" onchange='CheckOccupation(this.value);'> 
 
\t <option> Select Occupation</option> 
 
\t <option> Lawyer </option> 
 
\t <option> Nurse </option> 
 
\t <option> Lawyer </option> 
 
\t <option> Teacher </option> 
 
\t <option> Programmer </option> 
 
\t <option> Accountant </option> 
 
\t <option> Other </option> 
 
</select> 
 

 
<input type="text" name="occupation" id="occupation" class="form-control" placeholder="please specify your occupation..." style='display:none;'/>

источник

2016-04-25 James

'' option' на html' на вопрос элементы не установлен 'value' атрибут? – guest271314

Кстати, вы используете одно и то же имя для двух элементов. Лучше их менять – Mojtaba

Я также попробовал '', но все тот же @ guest271314 – James

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

function CheckOccupation(val){ 
var element=document.getElementById('occupation'); 
if(val==='Other') 
    element.style.display='block'; 
else 
    element.style.display='none'; 
}

HTML

<select class="form-control" name="occupation1" onchange='CheckOccupation(this.value);'> 
    <option> Select Occupation</option> 
    <option value="Lawyer"> Lawyer </option> 
    <option value="Nurse"> Nurse </option> 
    <option value="Lawyer"> Lawyer </option> 
    <option value="Teacher"> Teacher </option> 
    <option value="Programmer"> Programmer </option> 
    <option value="Accountant"> Accountant </option> 
    <option value="Other"> Other </option> 
</select> 

<input type="text" name="occupation2" id="occupation" class="form-control" placeholder="please specify your occupation..." style='display:none;'/>

источник

2016-04-25 14:27:48

содержимое этого элемента <option> автоматически не их стоимость. Вы должны указать атрибут value.

function CheckOccupation(val){ 
 
var element=document.getElementById('occupation'); 
 
if(val=='Other') 
 
    element.style.display='block'; 
 
else 
 
    element.style.display='none'; 
 
}

<select class="form-control" name="occupation" onchange='CheckOccupation(this.value);'> 
 
\t <option> Select Occupation</option> 
 
\t <option> Lawyer </option> 
 
\t <option> Nurse </option> 
 
\t <option> Lawyer </option> 
 
\t <option> Teacher </option> 
 
\t <option> Programmer </option> 
 
\t <option> Accountant </option> 
 
\t <option value="Other"> Other </option> 
 
</select> 
 

 
<input type="text" name="occupation" id="occupation" class="form-control" placeholder="please specify your occupation..." style='display:none;'/>

источник

2016-04-25 14:24:05 user3297291

Я сделал это раньше, но все тот же. – James

Вы по-прежнему должны включать значение ввода в свою форму submit. Вы не можете дать ему тот же атрибут name. – user3297291

Я думаю, что вам может понадобиться указать некоторое значение в опции тега. Попробуйте это:

<select class="form-control" name="occupation" onchange='CheckOccupation(this.value);'> 
 
\t <option value="select"> Select Occupation</option> 
 
\t <option value="lawyer"> Lawyer </option> 
 
\t <option value="nurse"> Nurse </option> 
 
\t <option value="lawyer"> Lawyer </option> 
 
\t <option value="teacher"> Teacher </option> 
 
\t <option value="programmer"> Programmer </option> 
 
\t <option value="accountant"> Accountant </option> 
 
\t <option> Other </option> 
 
</select>

источник

2016-04-25 14:24:19 rubentd

Я тоже делал это, но это еще не решило мою проблему. – James

Вы установили имя = "оккупация" для обоих полей. Попробуйте использовать разные имена для обоих.

<select class="form-control" name="occupation" onchange='CheckOccupation(this.value);'> 

<input type="text" name="occupation" id="occupation" class="form-control" placeholder="please specify your occupation..." style='display:none;'/>

источник

2016-04-25 14:26:14

Хорошо, я попробую. – James

Благодарим за отправку ответа, моя проблема решена. Надеюсь, я могу оценить всех, кто дал правильный ответ, но моя привилегия ограничена. Это сработало! – James

Смотреть это Я создал plunker для вас: Plunker link

Попробуйте не использовать элемент var.

источник

2016-04-25 14:31:05

Это должно работать:

function CheckOccupation(selectedType){ 
 
    if (selectedType == 'Other'){ 
 
\t \t document.getElementById('occupation').style.display = 'block'; 
 
    
 
\t } else{ 
 
\t \t document.getElementById('occupation').style.display = 'none'; 
 
    
 
\t } 
 
}

<select class="form-control" name="occupation" onchange='CheckOccupation(this.value);'> 
 
\t <option> Select Occupation</option> 
 
\t <option value="Lawyer"> Lawyer </option> 
 
\t <option value="Nurse"> Nurse </option> 
 
\t <option value="Teacher"> Teacher </option> 
 
\t <option value="Programmer"> Programmer </option> 
 
\t <option value="Accountant"> Accountant </option> 
 
\t <option value="Other"> Other </option> 
 
</select> 
 

 
<input type="text" name="occupation_other" id="occupation" class="form-control" placeholder="please specify" style='display:none;'/>

источник

2016-04-25 14:32:06

проблема заключается в том, что вы назвали выберите (род занятий), а затем названный вход (род занятий)

они не могут быть отправлены же название, старайтесь изменить любой из них

источник

2016-04-25 14:39:23

Благодарим за отправку ответа, моя проблема решена. Надеюсь, я могу оценить всех, кто дал правильный ответ, но моя привилегия ограничена. – James

Попробуйте заменяя event на this.value в качестве параметра, переданного в CheckOccupation; включая атрибут value: option элементов; изменение name значение на #occupation до "other"; также удаление дубликатов <option> имеющих .innerHTML"Lawyer"

<script> 
 
    function CheckOccupation(event) { 
 
    var val = event.target.value; 
 
    var element = document.getElementById("occupation"); 
 
    if (val == "Other") 
 
     element.style.display = "block"; 
 
    else 
 
     element.style.display = "none"; 
 
    console.log(val) 
 
    } 
 
</script> 
 

 
<select class="form-control" name="occupation" onchange='CheckOccupation(event);'> 
 
    <option>Select Occupation</option> 
 
    <option value="Lawyer">Lawyer</option> 
 
    <option value="Nurse">Nurse</option> 
 
    <option value="Teacher">Teacher</option> 
 
    <option value="Programmer">Programmer</option> 
 
    <option value="Accountant">Accountant</option> 
 
    <option value="Other">Other</option> 
 
</select> 
 

 
<input type="text" name="other" id="occupation" class="form-control" placeholder="please specify your occupation..." style='display:none;' />

источник

2016-04-25 14:46:50 guest271314

Выберите опцию не получает значение

ответ

Смежные вопросы