菜单

jsp页面显示数据库的数据信息表

2018年11月15日 - Ajax

ajax发送请求到controller,controller响应一个json格式的数让页面,

 

JSON.parse()再解析json字符串,用$.each遍历。

 
 在日常jsp开发被;最核心的一个操作有是将前面增长到数据库被的音信在jsp页面中显出来,也就是增删改查中的检索的一致有些;

   @RequestMapping("/list")
  public @ResponseBody java.util.List<UserVO> List() throws Exception{
    return service.get();
  }


<body>
<div id="datatable"></div>
</body>
<script type="text/javascript">
$(document).ready(function(){
  $.ajax({
    type:"get",
    url:"/meihao/login/list.action",
    async:true,
    success:function(result){
      var m="<ul>";
      result=JSON.parse(result); 
      $.each(result, function(i,n) {
        console.log(n);
        m+="<li>"+"姓名:"+n["username"]+"密码:"+n["password"]+"</li>";
      });
      m+="</ul>";
      $("#datatable").append(m);  
    },
    error:function(error){
      alert(error.status+""+error.statusText);
    }
  });
});
</script>

下是以上部分的付出步骤同分析。

以上这篇json获取数据库底音讯以前端页面显示方式就是是稍稍编分享给大家之全部内容了,希望能被大家一个参照,也盼望大家多多支持脚本的家。

  1.在jsp页面:

卿或许感兴趣之稿子:

<thead>
<tr>
<th>用户称</th>
<th>用户性别</th>
<th>用户年龄</th>
</tr>
</thead>
<tbody>

<% AccountDAO accountdao=new AccountDAO(); List
list=accountdao.select();//从数据库中查询有的用户,得到的是一个成团(数组)

  for(int i=0;i<list.size();i++) { Account account=list.get(i);
out.write(“”); out.write(“”+account.getAname()+””);

  out.write(“”+(account.getSex().equals(“m”)?”男”:”女”)+””);

  out.write(“”+account.getAge()+””);

  out.write(“”);

}

%>

 </tbody>

2.在html页面:

<thead>
<tr>
<th>用户称</th>
<th>用户性别</th>
<th>用户年龄</th>
</tr>
</thead>
<tbody>
<tr>
<td>王五</td>
<td>男</td>
<td>20</td>
</tr>
<tr>
<td>里斯</td>
<td>男</td>
<td>22</td>
</tr>
</tbody>

jsp页面和html页面:

             图片 1

数据库被的数目:

                           
 图片 2

      两者显示效果等同只不过一个凡是动态网页一个凡是静态网页罢了。

二 片代码:

TeacherDao teacherDao = new TeacherDao();
List<Teacher> teachers = teacherDao.findAllTeacher();

for(int i=0;i<teachers.size();i++){
Teacher teacher = teachers.get(i);
%>
<tr>
<td><input name=”” type=”checkbox” value=”” /></td>
<td><%=teacher.getTno() %></td>
<td><%=teacher.getTname() %></td>
<td><%=teacher.getTsex() %></td>
<td><%=teacher.getProf() %></td>
<td><%=teacher.getDepart() %></td>
<td><%=teacher.getTbirthday() %></td>
<td><a href=”#” class=”tablelink”>查看</a> <a
href=”#” class=”tablelink”> 删除</a></td>
</tr>
<%
      }
%>

总:用心学习,注意总结,就哼了!

图片 3

相关文章

发表评论

电子邮件地址不会被公开。 必填项已用*标注

网站地图xml地图