通过制表符和jQuery和JSP加载替代内容

我有一个政策类型的数据表(选项包括单身,夫妻,家庭和单亲家庭)。 我希望有一个标签式界面,每个策略类型占用一个选项卡。 同时,在相关选项卡下方显示与相关政策类型相关的数据表。 当用户单击另一个选项卡时,将显示另一个数据表。

我想过从数据库导出数据然后将其转换为XML,从而通过XSLT和/或jQuery将其解析为HTML。 我认为这太过分了,因为它只是一张简单的表格。

我想做的是在外部服务器页面上进行所有处理,在这种情况下是JSP,只需交换掉大量的HTML。 因此,用户单击调用外部JSP的选项卡。 然后,外部JSP检索相关选项卡的数据,构建表,然后在屏幕上显示。 或者外部JSP可以查询数据库,使用唯一的id构建所有四个表,然后jQuery只加载已调用的表。 最后,通过JSP构建四个单独的HTML然后单独调用它会更容易吗? 我只想说一个HTML是诚实的。

如果表是根据JSP的请求构建的,然后提供给客户端,我不知道它是否会破坏AHAH的对象。 我还担心如果我们查询数据库并构建表,那么如果数据库数据发生变化,它将如何更新表的内容。

我认为这也可以在页面上完成,即构建4个表并使用CSS显示隐藏与活动选项卡无关的表:无但我不确定可访问性 – 屏幕阅读器是否会获取此数据?

抱歉,如果这没有意义,我觉得我可能试图过度复杂化,但我只是想找到最好的方法。 它很晚了:(

你考虑过JSON格式吗? 有一些Java API可以将Javabean对象(的集合或映射)无缝转换为JSON格式,例如Google Gson 。 在JavaScript / jQuery中,您可以完美地处理JSON,就好像它是一个有价值的JavaScript对象。 它与Java中的Javabean相当。 没有格式化和解析XML的开销。

您可以创建一个将JSON字符串写入响应的Servlet ,以便jQuery的$.getJSON()可以调用它。 这是一个启动示例,其中Item是一个虚构的Javabean,具有三个属性idnamevalue

 protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { List items = itemDAO.list(); String json = new Gson().toJson(items); response.setContentType("application/json"); response.setCharacterEncoding("UTF-8"); response.getWriter().write(json); } 

要在表中显示这些项,只需在jQuery中大致这样做:

  ... 

就这样! 希望这能带来新的见解。 您可以在任何选项卡的click事件中使用它。 如果没有那么多差异,您甚至可以重复使用相同的表进行显示。 只需事先做一个$('#table').empty()来摆脱所有行。

编辑 :我忽略了一个重要的考虑因素:

但我不确定可访问性 – 屏幕阅读器会不会获取这些数据?

屏幕阅读器不会执行任何JavaScript / CSS。 如果这实际上是一个showstopper,那么你需要放弃JS / jQuery的想法,并在每个标签中使用普通的链接进行“普通的”同步请求,并利用Servlet和JSP的JSTL / ELfunction进行显示内容有条件地基于请求参数。