我想在php中使用此下拉列表,当用户在有限的时间单击YES时,页面将自动刷新,并且新的“ Available”输入类型已输入用户想要的有限时间的开始日期和结束日期。我不知道如何键入代码。我需要使用javascript还是只需要在代码中使用php函数标签来解决此问题。任何可能知道的人都可以帮助我,谢谢:)
example output
我只在代码中使用PHP和MySQL
这是我的一些代码
<tr height="46">
<td>Limited time?</td>
<td>:
<select name="limitedtime">
<option <?php if($ec_programme_expire=='0')echo 'selected'; ?>value="0">NO</option>
<option <?php if($ec_programme_expire=='1')echo 'selected'; ?>value="1">YES</option>
</select>
</td>
</tr>
<tr height="46">
<td>Availability</td>
<td>:
<input class="txtf" name="ef_date" type="text" id="datepicker"/>
to
<input class="txtf" name="def_date" type="text" id="datepicker2"/>
</td>
</tr>
<script>
$(function() {
$( "#datepicker" ).datepicker( "option", "dateFormat", $( this ).val() );
$( "#datepicker").datepicker({
changeMonth: true,
changeYear: true,
dateFormat: 'dd-mm-yy'
});
});
$(function() {
$( "#datepicker2" ).datepicker({
changeMonth: true,
changeYear: true,
dateFormat: 'dd-mm-yy'
});
});
</script>
最佳答案
JQuery可以做到这一点,而无需刷新页面。
您可能需要向选择元素添加一个ID,然后将日期选择器包装到具有ID的div元素。您可以在加载页面时隐藏日期选择器,然后仅在用户选择yes
时显示。
$('#limitedtime').on('change', function() {
if (this.value == 1) {
$('#pickdate').show();
} else if (this.value == 0) {
$('#pickdate').hide();
}
});
#pickdate{
display:none;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
Limited Time?
<select id="limitedtime" name="limitedtime">
<option selected>Select</option>
<option value="0">NO</option>
<option value="1">YES</option>
</select>
<div id="pickdate">
Availability: <input class="txtf" name="ef_date" type="text" id="datepicker"/> to <input class="txtf" name="def_date" type="text" id="datepicker2"/>
</div>