java将日期数据显示在前端日期控件上

实现的效果

在这里插入图片描述

过程:前端通过ajax请求后台,java从数据库取出数据经过后台处理,返回前端然后显示。

    将数据库读取到的时间数据进行格式修改
    SimpleDateFormat simpleDateFormat = new SimpleDateFormat("yyyy-MM-dd");
    String stutime = simpleDateFormat.format(stuInformation.getStutime());
   //stuInformation.getStutime()为从数据库读取到的数据

java端整体代码

     
     //返回学生信息,返回数据为json数据
      @RequestMapping("/ChangeInformation")
        @ResponseBody  // 用于转换对象为json
        public List<Map<String, Object>> list(HttpSession session) {

        List<Map<String, Object>> list = new ArrayList<Map<String, Object>>();
        Map<String, Object> m = new HashMap<String, Object>();
        String username = (String) session.getAttribute("username");
        StuInformation stuInformation = userService.findInformationByUsername(username);
        // StuInformation stuInformation=userService.findInformationByUsername("1");
        //将数据库读取到的时间数据进行格式修改
        SimpleDateFormat simpleDateFormat = new SimpleDateFormat("yyyy-MM-dd");
        String stutime = simpleDateFormat.format(stuInformation.getStutime());
        m.put("stuid", stuInformation.getStuid());
        m.put("stuname", stuInformation.getStuname());
        m.put("sex", stuInformation.getSex());
        m.put("stutime", stutime);
        list.add(m);
        return list;
    }
    

前端ajax请求


  
  $(function(){
            $.ajax({
                url:"ChangeInformation",
                type:"post",
                dataType:"json",
                success:function(data){
                    var arr = eval(data);
                    console.log(arr);
                    console.log(arr[0].stuname);
                    console.log(arr[0].stuid);
                    console.log(arr[0].stutime);
                    console.log(arr[0].sex);
                    $("#stuname").attr("value",arr[0].stuname);
                    $("#stuid").attr("value",arr[0].stuid);
                    $("#sex").attr("value",arr[0].sex);
                    $("#stutime").attr("value",arr[0].stutime);
                },
                error:function(error){
                    alert(error);
                }
            })
        })
        

前端代码


     <div class="form-group">
                    <label  class="col-sm-2 control-label">姓名</label>
                    <div class="col-sm-6">
                        <input type="text" class="form-control" id="stuname" name="stuname" >
                    </div>
                </div>
                <div class="form-group">
                    <label  class="col-sm-2 control-label">学号</label>
                    <div class="col-sm-6">
                        <input type="text" class="form-control" id="stuid" name="stuid" >
                    </div>
                </div>
                <div class="form-group">
                    <label  class="col-sm-2 control-label">性别</label>
                    <div class="col-sm-6">
                        <input type="text" class="form-control" id="sex" name="sex" >
                    </div>
                </div>
                <div class="form-group">
                    <label  class="col-sm-2 control-label">入学时间</label>
                    <div class="col-sm-6">
                        <input type="date" class="form-control" id="stutime" name="stutime">
                    </div>

发布了21 篇原创文章 · 获赞 9 · 访问量 4500

猜你喜欢

转载自blog.csdn.net/qq_36470898/article/details/100119639
今日推荐