在PHP中单击下拉菜单中的“是”后显示输入文本?

时间:2019-08-20 01:19:35

标签: javascript php jquery mysql

我想在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>

1 个答案:

答案 0 :(得分:0)

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>