Я очень новичок в JQuery, пожалуйста, считай меня новичком. У меня есть PHP-форма, где у меня есть кнопка Radio. На основании того, какое радио выбрано, я хотел бы отключить выбор / выпадающий список. Ниже приведен сценарий:
Кнопка «Радио»: ежедневный и другой выбор: название божества
Если пользователь выбирает Misc, то Select (Deity Name) должен быть отключен и наоборот.
Я уже импортировал JQuery на свою страницу.
header.php
!-- JQuery 1.12.3 JS --> <script src="../js/jquery-1.12.3.min.js"></script> Код HTML
<tr> <td class="col-md-4"><label class="control-label">Pooja Type</label></td> <td class="col-md-8" align="center"> <label class='radio-inline'><input type='radio' name='poojaType' value='daily' checked>Daily</label> <label class='radio-inline'><input type='radio' name='poojaType' value='misc'>Misc</label> </td> </tr> <tr> <td class="col-md-4"><label class="control-label" for="deity">Deity Name</label></td> <td class="col-md-8"><select class="form-control" name="deityName">
Пожалуйста посоветуй.
Следуйте за кодом:
Предположим, у вас есть две переключатели:
<input type='radio' name='radios' id='rdbDaily' value='Daily' /> Daily <input type='radio' name='radios' id='rdbMisc' value='Misc' /> Misc
и одно выпадающее меню, как показано ниже:
<select id='selectordropdown'> <option>Deity Name</option> </select>
вы можете использовать ниже jquery, чтобы включить или отключить выпадающее меню, выбрав переключатели:
$('input:radio[name="radios"]').change(function() { if ($(this).val()=='Daily') { $('#selectordropdown').attr('disabled', false); } else if ($(this).val()=='Misc') { $('#selectordropdown').attr('disabled', true); } });
или вы также можете использовать ниже jquery для включения / выключения вашего раскрывающегося списка:
$("#rdbDaily").click(function() { $("#selectordropdown").attr("disabled", false); }); $("#rdbMisc").click(function() { $("#selectordropdown").attr("disabled", true); });
Я уверен, что это поможет вам. Если это так, не забудьте отметить мой ответ …;)
благодаря
Вы можете просто получить checked value в change event radio button и установить его против значения disabled атрибута, как показано ниже.
$('input[name="poojaType"]').on('change', function() { $('select[name="deityName"]').attr('disabled', this.value != "daily") });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <tr> <td class="col-md-4"> <label class="control-label">Pooja Type</label> </td> <td class="col-md-8" align="center"> <label class='radio-inline'> <input type='radio' name='poojaType' value='daily' checked/>Daily</label> <label class='radio-inline'> <input type='radio' name='poojaType' value='misc' />Misc</label> <select name="deityName"> <option>Value 1</option> <option>Value 2</option> <option>Value 3</option> <option>Value 4</option> </select> </td> </tr>
Ниже приведен код для JQuery:
<script> $(':radio[name=poojaType]').change(function () { var prop = this.value == 'misc'; $('select[name=deityName]').prop({ disabled: prop, required: !prop }); }); </script>