Вывод скрытых входов на основе выпадающего списка в форме

Question

Я пытаюсь вывести четыре скрытых ввода на основе выбора пользователя в раскрывающемся списке.

<label>Neighborhood:</label>
<select id="district">
    <option value="">- Select -</option>
    <option value="warehouse">Warehouse District</option>
    <option value="gateway">Gateway District</option>
    <option value="tremont">Tremont</option>
    <option value="shoreway">Detroit Shoreway</option>
</select>

Например, если пользователь выбирает район склада, эти скрытые входы добавляются в форму.

<input type="hidden" name="idx-q-LatitudeMax" value="41.50534740463771" /> <input type="hidden" name="idx-q-LatitudeMin" value="41.49729607499309" /> <input type="hidden" name="idx-q-LongitudeMin" value="-81.70605182647705" /> <input type="hidden" name="idx-q-LongitudeMax" value="-81.69352054595947" />

Я нашел несколько решений для изменения одного значения, но мне нужно вывести все четыре.

Любая помощь будет принята с благодарностью

Answer 1

"Свойство type нельзя изменить (модель безопасности IE)." Посмотрите измените тип поля ввода с помощью jQuery

Или вы можете сделать это

Добавьте класс к вашему входу, как это

<input class="hidden warhouse" name="idx-q-LatitudeMax" value="41.50534740463771"/> 
<input class="hidden warhouse" name="idx-q-LatitudeMin" value="41.49729607499309"      /> 
<input class="hidden warhouse" name="idx-q-LongitudeMin" value="-81.70605182647705" /> 
<input class="hidden warhouse" name="idx-q-LongitudeMax" value="-81.69352054595947" />

скрытый класс css имеет «display: none»

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

$('#district').change(function(){
 $('input.hidden').hide()
 if($(this).val() == "warehouse"){
   $("input.warehouse").show()
 }
})