[英]Dropdown menu using AJAX
我已經安裝了一個下拉菜單(在php站點中),該菜單利用Ajax功能填充了下拉列表。 可以正常工作,只是列表中的內容只有在您使用Tab鍵進入下拉按鈕時才會填充。 如果單擊該按鈕,則需要單擊兩次以進行填充(這往往會以主要方式丟人)。
該函數從焦點事件中調用。 我試過單擊,onclick,加載,onload和其他操作,但是沒有任何效果。
表單代碼為:
echo "<script>
$(document).ready(function(){
$('.sel_field').focus(function(){
$.ajax({
url: 'GetClient.php',
type: 'post',
dataType: 'json',
success:function(response){
var len = response.length;
$('#sel_user').empty();
for( var i = 0; i<len; i++){
var id = response[i]['id'];
var name2 = response[i]['username'];
var name = response[i]['name'];
var mat = response[i]['Matter'];
$('#sel_user').append('<option value='+id+'> ClientID: '+id+' - Name: '+name+' : '+mat+'</option>');
}
}
});
});
});
</script>";
echo "<tr>";
echo "<td>";
echo "Client ID <span style='font-size:10px'>(Press tab to enter)</span>";
echo "</td>";
echo "<td>";
echo "<select name='clientID' style='width:460px' class='form-control sel_field' id='sel_user' >
<option value='0'> - Make A Selection -</option>
</select>";
echo "</td>";
echo "</tr>";
不知道自己的期望和實際獲得的幫助很難。 我已經根據您的代碼制作了一個代碼段,將ajax調用替換為setTimeout函數。 它正在做某件事...與您所經歷的距離有多近/多遠,以及您究竟期望什么?
-編輯:也許延遲的負載正在扔人? 我添加了一行內容,以便在等待Ajax完成其工作的同時將選擇文本更改為“正在加載”。
$(document).ready(function(){ $('.sel_field').focus(function(){ $('#sel_user').html('<option value="0">Loading...</option>'); setTimeout(function(){ var len = 2; $('#sel_user').empty(); for( var i = 0; i<len; i++){ var id = 1; var name2 = 'name2-'+i; var name = 'name-'+i; var mat = 'mat'+i; $('#sel_user').append('<option value='+id+'> ClientID: '+id+' - Name: '+name+' : '+mat+'</option>'); } }, 1000); }); });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <tr> <td> Client ID <span style='font-size:10px'>(Press tab to enter)</span> </td> <td> <select name='clientID' style='width:460px' class='form-control sel_field' id='sel_user' > <option value='0'> - Make A Selection -</option> </select> </td> </tr>
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.