select下拉框,選擇其中一個,然後進行查詢,完成之後,頁面上的select框不回顯當前查詢時選中的值
阿新 • • 發佈:2019-04-03
1.首先在jsp頁面select語句下面增加一個隱藏的input
<select id="demo" name="demo" onchange="entryChange();"> <option value="">--請選擇--</option> <option value="">1</option> <option value="">2</option> <option value="">3</option> </select> <input id="entryId" name="entryId" type="hidden" value="此處寫你從後臺接收到的值">
2.然後對input框中的值進行賦值,傳給後臺程式碼
function entryChange(){
var entryId= document.getElementById("demo").value;
$('#entryId').val(entryId);
}
3.賦值之後在後臺定義,然後給他set/get方法,以便在jsp程式碼中進行接收
private String entryId; public String getEntryId() { return entryId; } public void setEntryId(String entryId) { this.entryId = entryId; }
4.從後臺會通過xml還是別的方式跳轉到jsp頁面,在頁面初始化方法中對傳進來的值進行處理
var entryId = $("#entryId").val(); //這裡根據你自己的需求來進行處理,因為我這裡的資料是用ajax獲取到的值拼接而成的 $.ajax({ contentType:"application/x-www-form-urlencoded;charset=UTF-8", type:"POST", url:"xxxx/xxxxxxxx.action?deptId="+deptId + "&" + Math.random(), dataType:"json", success:function(res){ var ststistic = "<option value=''>"+ "--請選擇--" +"</option>"; for(var i=0;i<res.length;i++){ res[i].statisticId; res[i].statisticName; if(entryId == res[i].statisticId){ ststistic=ststistic+"<option selected='selected' value='"+res[i].statisticId+"'>"+res[i].statisticName+"</option>"; }else{ ststistic=ststistic+"<option value='"+res[i].statisticId+"'>"+res[i].statisticName+"</option>"; } } $("#informationTypeIdEntry").html(ststistic); } });
對迴圈出來的值進行判斷,如果從後臺傳進來的entryId與迴圈出來的某個值相同,則在<option>中拼接上 selected='selected'屬性。
5.還有一種情況就是下拉框的資料顯示在頁面上是ztree的形式,這種形式使用的不是select標籤,而是input標籤,那麼我們這裡就還可以使用另外一種回顯方法(上面的都一樣,只不過從後臺返回值的時候做的回顯操作不一樣):
//ztree形式的input框
<input id="citySel" name="citySel" readonly type="text" onclick="showMenu(this); return false;"/>
var entryId= $("#entryId").val();
if (citySelName.length > 0) {
$("#citySel").val(citySelName).trigger("change");
} else {
$("#citySel").val(null).trigger("change");//id為空的話 select框就是空
}
也可以起到回顯的