WdatePicker日曆控件動態設置屬性參數值

首先吐槽一下需求人員給了我一個很坑的需求：WdatePicker日曆控件裏面選擇的最小時間（minDate）的值是級聯動態改變的，而且這個值要從數據庫獲取，這樣子只能使用 ajax 來發起請求獲取minDate屬性值。

先看代碼：

<div class="control-group">
	<label class="control-label">報讀月份：</label>
	<div class="controls">
		<input name="readMonth" type="text" readonly="readonly" maxlength="20" class="input-medium Wdate required"
			value="${launchReadMeter.readMonth}" οnclick="checkClick(this);"/>
		<span class="help-inline"><font color="red">*</font> </span>
	</div>
</div>


<script type="text/javascript">
	function checkClick(obj) {
		$(obj).attr("value","");
		var officeId = $("#officeId").val();
		var meterType = $("#meterType").val();
		if(officeId!="" && meterType!="") {
			$.ajax({
				url:'${ctx}/launchreadmeter/launchReadMeter/getReadMeter',
				type:'post',
				dataType:'json',
				async:false,
				data:{
					officeId:officeId+"",
					meterType:meterType+""
				},
				success:function(data){
					WdatePicker({minDate:data.readMonth,maxDate:'%y-%M',dateFmt:'yyyy-MM',isShowClear:false});
				}
			});
		} else {
			top.$.jBox.tip("請先選擇小區和儀表類型！");
		}
	}
</script>

 

圖解：

 

 

注意：ajax 方法必須設置同步（async:false），不然 WdatePicker 時間控件 就失效了，因爲異步執行就會導致一個問題，οnclick="checkClick(this);" 監聽方法會先執行完了，儘管還是會進入success function 但已經不會再彈出時間選擇控件了。

 

推薦閱讀：http://www.cnblogs.com/yuhanzhong/archive/2011/08/10/2133276.html

                 http://www.cnblogs.com/southwind/articles/4170292.html

 

關注公衆號，分享乾貨，討論技術，你的支持是我最大的動力！！！