SSM框架---之遇到的问题

• handlerbars模板
• 前端获取当前时间
• ajax格式化后端时间（毫秒 整数）
• jsp格式化时间
• WdatePicker 时间选择器 插件
• • 引入js和css
  • 使用
• 全选和全不选
• 批量删除
• • js
  • controller
  • mapper.xml
• 省市县三省联动
• • js：
  • controller
  • mapper.xml

<%@ page contentType="text/html;charset=UTF-8" language="java" %>


    
    
    //<%-- jquery框架   --%>
    
    //<%--  使用Javascript模板简化操作 ：Handlebars.js：http://handlebarsjs.com  --%>
    
    





    




    

<%--//注意：type为：text/template--%>：模板

jsp和js

window.onload = function () {
    setInterval(function () {
        getDate();
    }, 10);    //定时器每秒调用一次getDate()
}
function getDate() {   //js 获取当前时间
    var oDiv = document.getElementById("curTime");
    var date = new Date();
    var year = date.getFullYear();//当前年份
    var month = date.getMonth();//当前月份
    var data = date.getDate();//天
    var hours = date.getHours();//小时
    var minute = date.getMinutes();//分
    var second = date.getSeconds();//秒
    var time = year + "-" + fnW((month + 1)) + "-" + fnW(data) + " " + fnW(hours) + ":" + fnW(minute) + ":" + fnW(second);
    var a = new Array("日", "一", "二", "三", "四", "五", "六");
    var week = new Date().getDay();
    var str = "星期" + a[week];
    oDiv.innerHTML = time + "　" + str;
}
function fnW(str){return str > 9 ?  str :  "0" + str;}  //补位 当某个字段不是两位数时补0

				//从后端获取到的日期
                var time = new Date(data.testDate).toJSON();
                var d = new Date(time);
                //如果小于9，前面加0
                var day = ("0" + d.getDate()).slice(-2);
                 //如果小于9，前面加0
                var month = ("0" + (d.getMonth() + 1)).slice(-2);
                //拼接日期
                var times=d.getFullYear() + '-' + (month) + '-' + (day);

<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>


 

        发车时间自
        
        至
        

        搜索
        重置
    

js：

$(function () {
    $("#checkAll").click(function () {
        var c = $("#checkAll").prop("checked");
        $(".checkbox").prop("checked",c);
    })
})

点击批量删除按钮

$("#batch").click(function (){
    var str = "";
    var count = 0;
    $("[name='ids']").each(function () {
        if ($(this).prop("checked")){
            count++;
            str += ","+$(this).val();
            console.log(str)
        }
    })
    str = str.substring(1);
    if(count >0){
        if (/confirm/i("确定是否删除这"+count+"条数据吗?")){
            $.ajax({
                url:"/station/batch",
                type:"POST",
                data:{ids:str},
                success:function (result) {
                    if (result.y == 'true'){
                        alert("删除成功！")
                        window.location.href = "/station/staList";
                    }
                },
                error:function () {
                    alert("系统错误")
                }
            })
        }
    }else {
        alert("请先选择");
    }

});

   //批量删除
    @RequestMapping("/batch")
    @ResponseBody
    public String batch(String[] ids){
        stationService.delBatch(ids);
        return "{'y':'true'}";
    }

    
    
        DELETE FROM station WHERe id IN
        
            #{ids}
        
    

            所在地区
            

                
                    --请选择--
                
            
            

                
                    --请选择--
                
            
            

                
                    --请选择--
                
            

 

$(function () {

    $.ajax({
        type:"GET",
        url:"/station/getChina",
        success:function(data) {
            var china = data.china;
            // console.log(china);

            //遍历省
            for (let i = 0; i < china.length; i++) {
                var option1 = ("" + china[i].province + "")
                $("#provinceId").append(option1);
            }

            //点击省
            $("#provinceId").change(function () {
                $("#cityId").html(""--请选择--"");
                for (let i = 0; i < china.length; i++) {
                    if(this.value == china[i].province_id){
                        var cities = china[i].hatCityList;
                        for (var j = 0;j < cities.length;j++){
                            //遍历市
                            var option2 = (""+cities[j].city+"")
                            $("#cityId").append(option2);


                            //点击市
                            $("#cityId").change(function () {
                                $("#areaId").html(""--请选择--"");
                                for (let i = 0; i < china.length; i++) {
                                    var cities = china[i].hatCityList;

                                    for (var j = 0;j < cities.length;j++){
                                        if(this.value == cities[j].city_id){
                                            var areas = cities[j].hatAreaList;

                                            //遍历县
                                            for (var k = 0;k < areas.length;k++){
                                                var option3 = (""+areas[k].area+"")
                                                $("#areaId").append(option3);
                                                console.log(areas[k].area);
                                            }

                                        }
                                    }

                                }

                            })
                        }
                    }
                }
            })

        }
    });

})

 //三级联动
    @GetMapping("/getChina")
    public @ResponseBody
    Map china(){
        Map map = new HashMap<>();
        List china = chinaMapper.getChina();
        map.put("china",china);
        return map;
    }

    
    
        
        
        
            
            
            
            
                
                
                
            
        
    


    
    
        select *,c.id cid,a.id aid from hat_province p
        LEFT JOIN hat_city c ON  p.province_id =c.father
        LEFT JOIN hat_area a ON  c.city_id = a.father