2014-02-26 135 views
1

在我的表单中,我有三个输入和一个选择框,In Select中只有三个值John,Matt和Lucy,但选择框全部是自动的,完全取决于它上面的Input并输入所有日期选择器。更改选择取决于输入值

当第一个输入有值然后选择框的值应该是约翰在此之后当第二个输入填写值将马特和最后3个输入也得到值比选择应该是露西 我的问题是我如何填充日期从数据库在选择时输入有一个值

  <form method="post" name="myform" class="compform" id="myform"> 
      <input type="hidden" name="UserName" value="<?php echo $_SESSION['UserName']; ?>" /> 
      <ul> 
      <li> 
       <p>Distribution Date:</p> 
       <input type="text" name="DistributionDate" id="datepicker" value="" readonly /> 
      </li> 
      <li> 
       <p>Reback Date:</p> 
       <input type="text" name="RebackDate" id="datepicker1" value="" readonly /> 
      </li> 
      <li> 
       <p>Final Date:</p> 
       <input type="text" name="FinalDate" id="datepicker3" value="" readonly /> 
      </li> 
      <li> 
       <p>Worker:</p> 
       <?php 
          $sql = "SELECT workerid,name FROM crew where workerid<> 0 ORDER By PeopleID"; 
          $result = mysql_query($sql); 

          echo "<select name='workerid' id='name'>"; 
          while ($row = mysql_fetch_array($result)) 
          { 
      ?> 
       <option <?php if($formId != '' && $res['workerid'] == $row['workerid']){ echo " selected='select' "; } ?> value='<?php echo $row['workerid']; ?>'><?php echo $row['name']; ?> </option> 
       <?php   } 
          echo "</select>"; 
          ?> 
      </li> 
+0

您可以使用Ajax – krishna

+0

作为@krishna提到,最好的方法将是使用Ajax。做一个onchange选择框来获得所需的结果,因为你提到的问题 –

回答

0

你必须使用Ajax和使用change功能这样

样本HTML

<input type="text" id="txt1"/> 
<input type="text" id="txt2"/> 
<input type="text" id="txt3"/> 
<br> 

<select id="select"> 
<option>Lucy</option> 
    <option>John</option> 
    <option>Matt</option> 
</select> 
每个文本框

jQuery的

$("#txt1").change(function(e){ 
    if($("#txt2").val() == "" && $("#txt3").val() == "") 
    { 
     $("#select").find('option:contains("John")').attr('selected','selected'); 

    } 

}); 

$("#txt2").change(function(e){ 
    if($("#txt3").val() == "") 
    { 
     $("#select").find('option').removeAttr("selected"); 
     $("#select").find('option:contains("Matt")').attr('selected','selected'); 
    } 

}); 

$("#txt3").change(function(e){ 

     $("#select").find('option').removeAttr("selected"); 
     $("#select").find('option:contains("Lucy")').attr('selected','selected'); 


}); 

Demo

+0

不工作在我的本地任何线索.... – user3283373

+0

你有没有在该页面添加导入jQuery? – krishna

+0

如果不在html的头部添加这个''script type =“text/javascript”src =“http://code.jquery.com/jquery-1.10.2.min.js”>' – krishna