我读过几本关于 JQuery、JSON 和 AJAX 的书。我正在尝试将使用较旧的 jsp 和 servlet 技术的工作网站转换为带有 JSON、AJAX 和 JQuery 的 jsp。我无法整合一切来做我需要的事情。
1) 用户使用简单的 jsp 登录,“login.jsp”。它提交给:
<form action="http://localhost:8080/sc_demo/dispatcher" name="login" id="login">
<div>
<label for="userId" class="label">UserId</label>
<input type="text" name="userId" id="userId" size="30">
</div>
<div>
<label for="password" class="label">Password</label>
<input type="password" name="password" id="password" size="30">
</div>
<div>
<label for="organization" class="label">Organization</label>
<input type="text" name="organization" id="organization" size="30">
</div>
<div>
<input type="hidden" name="event" id="event" value="_login">
<input type="submit" name="submit" id="submit" value="Login">
</div>
</form>
2) 调度器 servlet 接收请求并使用 _login 的事件值,调用 EventHandler 进行身份验证并创建用户“令牌”。然后它使用:
Token userToken = new Token(userId, userName, organization, role, new GenericNotifier());
String jspPath = "/home.jsp?parms="+userToken.getResponseString("/home.jsp", "HR", "tasklist");
getServletContext().getRequestDispatcher(jspPath).forward(
request, response);
3)这正确地提出了一个jsp“home.jsp”。
4) home.jsp 有
<script type="text/javascript" src="_js/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="_js/nav1.1.min.js"></script>
<script type="text/javascript" src="_js/jquery.countdown.js"></script>
<script type="text/javascript" src="_js/parseURL.js"></script>
<script type="text/javascript" src="_js/header.js"></script>
在页面的标题中。5) header.jsp 有:
<!DOCTYPE HTML>
<%@ page import="java.util.*" %>
<%
String userToken = (String)request.getParameter("parms"); // from login
%>
<script>
$(document).ready(function(){
var data = $.parseJSON('<%=userToken%>');
alert('app = '+data.app);
$('#doApplication').text(data.app);
});
</script>
<div id='doApplication'></div>
<hr>
现在,问题是我无法解析来自 userToken 的任何内容。以下是页面来源的一段:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Home</title>
<script type="text/javascript" src="_js/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="_js/nav1.1.min.js"></script>
<script type="text/javascript" src="_js/jquery.countdown.js"></script>
<script type="text/javascript" src="_js/parseURL.js"></script>
<script type="text/javascript" src="_js/header.js"></script>
<script type="text/javascript" src="./_js/jquery.validate.min.js"></script>
<!-- jQuery UI Theme -->
<link type="text/css" href="./_js/alpaca/lib/jquery-ui-latest/jquery-ui-latest.custom.css" rel="stylesheet"/>
<!-- Additional CSS -->
<link type="text/css" href="./_js/alpaca/examples/css/960.fluid.css" rel="stylesheet"/>
<script type="text/javascript" src="https://use.typekit.com/fnm3kpm.js"></script>
<script type="text/javascript">try{Typekit.load();}catch(e){}</script>
<!-- LINK REL="stylesheet" HREF="_css/site.css" / -->
<LINK REL="stylesheet" HREF="_css/home.css" />
<LINK REL="stylesheet" HREF="_css/jquery.countdown.css" />
</head>
<body>
<div class="wrapper">
<div class="header">
<script>
$(document).ready(function(){
var data = $.parseJSON('{jsp:"home.jsp",app:"HR",process:"tasklist",userToken: {result:"S",tokenId:"98797",userID:"woo",userName:"John",organization:"Shoulders",role:"mgr",notifierId:"956597"}}');
if( token != null )
{
$('#token').text(token);
}
alert('app = '+data.app);
$('#doApplication').text(data.app);
});
</script>
我检查了 .parseJSON('X'); 中的字符串 X。没有任何空格或任何换行符。它看起来像一个有效的 JSON 对象。虽然它不会解析它?我没有收到错误,但也没有收到带有 data.app 值的警报字段,它应该在那里。
我的一般问题是我看不到页面流不是“预定义”的示例。在我的例子中,每个操作都会向调度程序生成一个提交(希望使用 AJAX),其中包含有关当前状态(来自 userToken)和表单数据的信息。根据表单数据,调度程序确定下一个 jsp 并使用请求/响应返回到该页面,其中包含 userToken 和要在该页面表单中显示的信息。
那么,如何使用表单数据向调度程序提交,在每个页面顶部的 $(document).ready 函数中捕获响应数据,将其解析并显示出来?