WdatePicker控件级联选择

控件代码

<td nowrap="true">
      <input style="width: 90px;" onclick="WdatePicker({ dateFmt: 'yyyy-MM',startDate:'%y-%M' })" class="Wdate" name="DateMonth" id="DateMonth">
      月
</td>
<td nowrap="true">
      -<input style="width: 90px;" onclick="WdatePicker({ dateFmt: 'dd',startDate:'%d' })" class="Wdate" name="DateDay" id="DateDay">
      天
</td>

 

页面加载 js代码

<script>
    $(function () {
        $("#DateMonth").val((new Date()).format('yyyy-MM'));
        $("#DateDay").val((new Date()).format('dd'));

        $("#DateMonth").bind("click focus", function () {
            var day = $dp.$('DateDay');
            WdatePicker({
                dateFmt: "yyyy-MM",
                onpicked: function () {
                    day.focus();
                }
            });
        });
        //级联显示
        $("#DateDay").bind("focus", function () {
            var d = $("#DateMonth").val();
            var date = new Date(d + '-01');
            var xdate = new Date(date.getYear(), date.getMonth() + 1, 0);
            WdatePicker({
                minDate: date,
                maxDate: xdate,
                dateFmt: "dd",
            });
        });
    });
</script>

  

效果

 

wdatepicker控件知识详解

 

posted @ 2017-08-01 21:18  tooy  阅读(457)  评论(0编辑  收藏  举报