进行页面展示时,通过有两种方式:
一种为传统的action,从action中查找数据再传到JSP页面上用JSTL进行展示;
第二种使用ajax从action中获取数据,再到页面上用JS拼接HTML或者在后台拼接完成了通过ajax返回到前台。
两种方法的缺点都比较明显:
第一种不适合于局部刷新,更也不适合于频繁刷新,也就是ajax的优点。
第二种可以局部刷新,但是需要拼接HTML,无论在后台还是在js中拼接HTML都比较麻烦。
所以呢,可以将以上两行方法结合起来使用:
直接调转到页面,通过ajax加载数据,将action中返回的数据传递到另一个模板JSP文件中进行加载,加载完成的数据会自动返回到ajax的回调函数中。
1、展示页面(index.jsp):也就是直接请求的页面,在这个页面上显示数据。页面结构很简单,就一个div用来包装数据。
<body style="overflow:auto;"> <h2>使用JSP模板文件加载页面数据</h2> <div id="tableDiv"></div> </body>
然后添加一个ajax方式用来请求数据:
$(function(){ $.ajax({ type:"post", async:false, data:{"time":new Date().getTime()}, dataType:"html", url:"tools!loadData.action", error:function(XMLHttpRequest, textStatus, errorThrown) { //alert(XMLHttpRequest.status); //alert(XMLHttpRequest.readyState); //alert(textStatus); alert("加载错误,错误原因:\n"+errorThrown); }, success:function(data){ //alert(data); var data2 = data.toString(); if((data2+"").indexOf("fail")>-1){//说明是错误信息 data2 = data2.replace("fail",""); }else{ $("#tableDiv").html(data); } } }); });
这里有个注意点:就是ajax的dataType类型必须为html,写成text或者json或者xml都会报错。
2、模板页面(template.jsp):数据加载的页面,加载完成后将数据返回到index.jsp。页面结构可以随便定义。
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> <%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %> <table cellspacing="0" cellpadding="0" border="0" width="100%" align="center" id="infoTable"> <tr class="firstTr"> <td>序号</td> <td>内容1</td> <td>内容2</td> <td>内容3</td> <td>内容4</td> </tr> <c:forEach items="${table1List }" var="table1" varStatus="order"> <tr> <td>${order.index+1}</td> <td>${table1.field1 }</td> <td>${table1.field2 }</td> <td>${table1.field3 }</td> <td>${table1.field4 }</td> </tr> </c:forEach> </table>
注意点: 页面中除了添加需要的page、tablib等指令,其他的都不要添加,连HTML的基本标签如html、body等都不需要添加了,要是添加了就等于在index.jsp的tableDiv中添加了一个信息页面。
3、action主要代码:
List<Table1> table1List = t1dao.findAll(); if(table1List!=null && table1List.size()>0){ request.setAttribute("table1List", table1List); request.getRequestDispatcher("/template.jsp").forward(request, response); }
关键代码是这句: request.getRequestDispatcher("/template.jsp").forward(request, response);
这句大家都很熟悉,就是页面跳转,没错就是让跳转到模板jsp页面中让它加载数据。
当然对于ajax,大家都知道一定会有一句response.getWriter().write(result);用来告知结果。在这种跳转的情况下result中的值也会被带到页面上,但是回调函数success方法返回的结果中却没有它。通过firebug的网络模式看到的“响应”结果却只有这个result还没有页面数据,这究竟是为啥我就不琢磨了。
至此,使用jsp模板文件加载数据的流程就完成了。用过之后会觉得ajax原来还有这么个怪脾气,JSP原来这么强大的!
相关推荐
3. **读取模板文件**:使用Velocity的`ResourceLoader`加载Word模板文件,这通常涉及到文件系统的操作或者使用URL。 4. **填充数据**:在上下文中添加你需要的数据,例如数据库查询结果、服务器配置信息等。 5. **...
1. **分页需求**:在大量数据展示时,分页是常见的优化手段,它能提高用户体验,避免一次性加载过多数据导致页面卡顿。 2. **基本步骤**: - 计算总页数:根据数据总数和每页显示条数计算。 - 显示页码导航:通常...
这个压缩包文件可能包含了一组预设计的JSP模板,这些模板可以极大地提高开发者的效率,因为他们可以直接使用或修改这些模板来快速构建网站的前端界面。 ASP(Active Server Pages)是微软公司的服务器端脚本环境,...
Servlet通常与JSP配合使用,JSP负责展示视图,而Servlet则处理业务逻辑和数据操作。 在“jsp+servlet 万能模板”中,常见的架构模式是MVC(Model-View-Controller)。模型(Model)代表数据和业务逻辑,视图(View...
在这个模板中,JavaScript可能被用来实现动态效果,如表单验证、导航菜单的响应式行为或数据的异步加载。例如,`nav.html`和`tab.html`可能会用到JavaScript来实现导航栏的交互功能。 MVC(Model-View-Controller)...
- 而修改JSP模板则可能涉及到页面布局的更改、添加新的动态内容或更新现有的表达式和脚本let。 6. **实战应用**: - 在实际项目中,开发者通常会创建一个Servlet来处理HTTP请求,然后根据需要转发或重定向到相应...
- 创建` JasperDesign`对象,从JRXML文件加载报表设计。 - 使用`JasperCompileManager`编译报表设计为`JasperReport`对象。 - 填充报表数据,创建`JasperPrint`对象,这需要一个`Map`对象来存储报表参数和数据源...
在IT行业中,网页开发是一项重要的工作,而"jsp文件转换成htm文件.zip"这个压缩包提供的工具或教程可能就是帮助开发者实现将基于Java Server Pages (JSP) 的动态网页转换为静态HTML(HTM)文件的过程。这个转换过程...
开发人员可以根据实际需求对JSP模板进行定制,例如修改CSS以调整颜色、布局,或者添加新的JSP页面来满足特定功能。此外,还可以结合数据库技术(如MySQL),实现动态数据的展示和管理,使网站更具交互性。 **4. ...
6. **显示数据**:最终,JSP页面会根据需求将JavaBean中的数据插入到HTML模板中,生成动态的网页内容。 此实例对初学者来说具有很高的学习价值,因为它演示了JSP和JavaBean在实际项目中的协同工作方式。理解这一...
该方法的核心思想是从数据库中取出相应的数据,然后将其替换到模板文件中,从而生成静态 HTML 页面。下面是一个简单的示例代码: ```jsp ; charset=gb2312" import="java.util.*,java.io.*"%> try { String ...
在这个“JSP网页连接数据库增删改查模板”中,我们主要探讨的是如何使用JSP来实现对数据库的操作,包括添加(Add)、删除(Delete)、修改(Update)和查询(Query)数据。 首先,我们需要一个数据库来存储和管理...
- **Flex组件嵌入**:JSP页面可以使用`<object>`或`<embed>`标签嵌入Flash内容,即Flex编译后的SWF文件。这样,Flex组件就能在网页中无缝展示,提供动态交互的报表体验。 - **事件处理**:Flex的交互事件(如点击、...
JSP文件由两部分组成:模板数据(Template Data)和JSP元素(JSP Elements)。模板数据是指JSP引擎不处理的部分,即标记……%>以外的部分,例如代码中的HTML内容等,这些数据会直接传送到客户端的浏览器。JSP元素则...
本项目“mvc+jsp做的增、删、改、查模板”是基于这一模式,使用Java语言,结合Servlet和JDBC(Java Database Connectivity)进行数据库操作,实现了基本的数据管理功能,包括增(Add)、删(Delete)、改(Update)...
本主题聚焦于如何在MyEclipse环境中使用JSP来实现用户登录验证,并将数据库中的信息导出到JSP页面上,同时进行分页处理。MyEclipse是一款强大的集成开发环境,特别适合Java Web应用的开发。 首先,我们需要了解JSP...
- **MVC模式**:在大型项目中,常使用Model-View-Controller架构,JSP作为视图(View),处理显示静态和动态数据。 **5. 开发工具** - **IDE支持**:如Eclipse、IntelliJ IDEA等提供对JSP开发的良好支持,包括...
在 Web 开发领域中,JSP(JavaServer Pages)是一种广泛使用的动态网页技术,它允许开发者在 HTML 文件中嵌入 Java 代码。然而,在实际应用中,当用户访问一个 JSP 页面时,服务器需要先执行 JSP 文件中的 Java 代码...
1. EL:简化了从JSP页面获取和设置数据的操作,语法简洁,如`${expression}`。 2. JSTL:提供了一系列标准标签,减少JSP中的脚本代码,提高可读性和可维护性,例如`<c:forEach>`, `<fmt:formatDate>`等。 六、MVC...
Ajax允许在后台与服务器交换数据并更新部分网页,而无需重新加载整个页面。然而,由于同源策略限制,直接使用Ajax进行文件上传并不容易,这时候Iframe就派上用场了。Iframe创建了一个独立的浏览上下文,可以在其中...