2016-03-07 49 views
0

PHP - 清除職務值下拉列表在復位按鈕按下

dept_ID  dept_name 
    1   Account 

職位

job_title_ID  job_title_name  dept_ID 
    1    Account Manager  1 
    2    Account Clerk   1 

user.php的

<html> 
<head> 
<link rel="stylesheet" href="js/jquery-ui-themes-1.11.1/themes/smoothness/jquery-ui.css" /> 
<script type="text/javascript" src="js/jquery-1.11.1.js"></script> 
<script type="text/javascript" src="js/jquery-ui-1.11.1/jquery-ui.js"> </script> 
<script> 
$(document).ready(function(){ 
    //---SELECT DEPARTMENT DROP DOWN LIST--- 
    $("#userdepartment").change(function(){ 
     var departmentID = $(this).val(); 

     $.ajax({ 
      type: 'POST', 
      url: 'change.php', 
      data: {departmentID: departmentID}, 
      success: function(html) 
      { 
       $("#userjobtitle").html(html); 
      } 
     }); 
    }); 
}); 
</script> 
</head> 

<body> 
<form name="adduser" method="post" action="user.php"> 
<table> 
    <tr> 
     <td>Department:</td> 
     <td> 
      <select name="userdepartment" id="userdepartment"> 
      <?php 
      //---Db connection--- 

      $query = "SELECT * 
         FROM department 
         ORDER BY dept_name ASC"; 
      $result = mysql_query($query); 

      print("<option value=\"\">select one</option><br>"); 
      while($row = mysql_fetch_array($result)) 
      { 
       print("<option value=\"" . $row['dept_ID'] . "\">" . $row['dept_name'] . "</option><br />"); 
      } 
      ?> 
      </select> 
     </td> 
    </tr> 

    <tr> 
     <td>Job Title:</td> 
     <td> 
      <select name="userjobtitle" id="userjobtitle"> 
        <option value="">select one</option> 
      </select> 
     </td> 
    </tr> 

    <tr> 
     <td><input type="submit" name="submit" value="Add" /></td> 
     <td><input type="reset" name="reset" value="Reset" /></td> 
    </tr> 
</table> 
</form> 
</body> 
</html> 

change.php

<?php 
//---DB connection--- 

$departmentID = $_POST['departmentID']; 

$q = "SELECT j.job_title_ID, j.job_title_name 
     FROM job_title j, department d 
     WHERE j.job_title_dept = d.dept_ID && d.dept_ID = $departmentID"; 
$r = mysqli_query($dbc, $q); 

echo '<option value="">select one</option>'; 
while($row = mysqli_fetch_array($r, MYSQLI_ASSOC)) 
{ 
    echo '<option value="'.$row['job_title_ID'].'">'.$row['job_title_name'].'</option>'; 
} 
?> 

從上面的代碼中,當我從部門下拉列表中選擇Account時,職位名稱下拉列表將顯示Account Manager和Account Clerk。
我的問題是當我點擊重置按鈕時,我應該如何清除工作標題下拉列表中的值?這是因爲當我單擊重置按鈕時,作業標題下拉列表不會清除該值。有人能幫助我嗎?

+0

這不是一個PHP的工作,除非你重新加載整個頁面。你可能想要在用戶界面中刪除它,並使用JS完成。如果你的架構不同,你可以用PHP來完成它,比如有一個返回列表的PHP服務和一個查詢它的AJAX請求 –

回答

0

您可以通過使用Javascript這樣做:

HTML:

<input type="reset" name="reset" value="Reset" onclick="reset();" /> 

的Javascript:

function reset(){ 
    $('#userjobtitle').prop('selectedIndex',0); 
} 
0

你應該jQuery的上onclick事件清除它,也可以是任何下拉列表:

$('#userjobtitle').val(''); 
0

您可以使用和onclick事件

<input type="reset" name="reset" value="Reset" 
     onclick="document.getElementById('userjobtitle').value='';" /> 
1

請清空選擇:

$('input[type="reset"]').click(function(e){ 
    e.preventDefault(); 
$('#userjobtitle').empty().append('<option value="">select one</option>'); 
});