添加日期选择控件,并显示日期相应的标题和数据。

要求:在页面添加日期选择控件,并显示日期相应的标题和数据。进入页面默认2017年01月。

实现:在页面上添加select控件,js通过调用id名,实现日期控件的范围。

主要问题1:月份控件的1-9月与数据库的两位数据无法对应。

【解决:当月份为1-9时,在前面添加0

function SetSelect1() {

          $(".js-example-basic-single").select2();

          var selYear = document.getElementById('selYear');

          var selMonth = document.getElementById('selMonth');

          setyear("selYear");

          setmonth("selMonth");

          if (new Date().getMonth() >= 1 && new Date().getMonth() <= 9) {

                    selYear.value = new Date().getFullYear();

                    selMonth.value = "0".concat(new Date().getMonth());

         } else {

                   selYear.value = new Date().getFullYear();

                   selMonth.value = new Date().getMonth();

        }

}

 】

主要问题2:使用js实现标题动态变化。

【解决:动态拼接标题语句,并渲染到页面上。

function SetTitle() {

              $(".page-header").empty();

              $(".page-header").html(

             selYear.value + "年" + selMonth.value + "月" + "医联常规统计信息:")

}

主要问题3:使用ajax传入日期选择参数,并动态显示数据。当数据不存在时,提示“暂无数据!”

【解决:

function ylcgtjQuery() {

        var selYear = $('#selYear').val();

        var selMonth = $('#selMonth').val();

        SetTitle();

        $.ajax({

                   url : "ylcgtjQuery!getYuzhiset.action",

                   type : "POST",

                   data: "selYear="+selYear+"&selMonth="+selMonth,

                   dataType : "text",

                   success : function(result) {

                          if (result != null) {

                               if(result!="nodata"){

                                      $("#ylcjtjDesc").empty();

                                       var str = result;

                                        //返回数据中数字显示红色

                                        var nums = result.match(/[1-9]\d*\.\d*|0\.\d*[1-9]\d*/g);

                                        if(nums!=null){

                                              for ( var i = 0; i < nums.length; i++) {

                                                       str = str.replace(nums[i], "" + nums[i]+ "");

                                               }

                                        $("#ylcjtjDesc").append(str);

                                         }

                               }else{

                                         $("#ylcjtjDesc").empty();

                                         var str = "暂无数据!";

                                        $("#ylcjtjDesc").append(str);

                                }

                         }

                  }

         }

);}


你可能感兴趣的:(添加日期选择控件,并显示日期相应的标题和数据。)