1. 程式人生 > >使用ajax載入資料字典表並載入到頁面下拉選框

使用ajax載入資料字典表並載入到頁面下拉選框

資料字典表 base_dict

![資料字典表結構](https://img-blog.csdn.net/20180930102414188?watermark/2/text/aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQxMDA5ODQ2/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70)

jsp頁面載入資料字典jquery程式碼

/* 使用ajax從後臺動態載入資料字典  生成下拉選框     
	typecode:資料字典型別
	positionId:將下拉選放入的標籤id
	selectame:生成下拉選時select標籤的那麼屬性值
	selectedid:需要回顯時選中的那個option
 */
	function loadSelect(typecode,positionId,selectname,selectedId){
			// 建立select物件   將name屬性指定
			var $select = $("<select name="+selectname+"></select>");//$select前的$表示他是一個jquery物件
			//新增提示選項
			$select.append($("<option value=''>---請選擇---</option>"));
			//使用jquery的ajax方法  訪問後臺action
			$.post("${pageContext.request.contextPath}/BaseDictAction",{dict_type_code:typecode},
			function(data){
				//遍歷程式碼
				$.each(data,function(i,json){
				//每次遍歷建立一個option物件   並新增到select物件(判斷一下是否需要回顯)
					var $option = $("<option value='"+json['dict_id']+"'>"+json["dict_item_name"]+"</option>");
					if(json['dict_id']==selectedId){
					/* 判斷是否需要回顯 */
						$option.attr("selected","selected");
					}
					/* 新增select物件 */
					$select.append($option);
				});
			},"json");
			//放回json陣列物件,對其進行遍歷   
			//將最終組裝好的select物件放入頁面指定位置
		 	$("#"+positionId).append($select);
	}