jsp用ajax提交form表单
没接触过ajax,找了网上的例子试了下。但点了提交没有值传回来,不知道哪里出错了,想做成这个效果的

show.jsp的代码:
<html>
<head>
<base href="<%=basePath%>">
<title>My JSP 'show.jsp' starting page</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<!--
<link rel="stylesheet" type="text/css" href="styles.css">
-->
<script type="text/javascript" src="jquery-1.3.2.min.js">
function doFind(){
$.ajax({
cache: true,
type: "POST",
url:"ajax.jsp", //把表单数据发送到ajax.jsp
data:$('#ajaxFrm').serialize(), //要发送的是ajaxFrm表单中的数据
async: false,
error: function(request) {
alert("发送请求失败!");},
success: function(data) {
$("#ajaxDiv").html(data); //将返回的结果显示到ajaxDiv中
}
});
}</script>
</head>
<body>
<form id="ajaxFrm" >
<input type="text" name="name">
<input type="button" onClick="doFind();" value="调用一下ajax" >
</form>
<div id="ajaxDiv"></div>
</body>
</html>
ajax.jsp的代码:
<body>
<%
String userName = request.getParameter("name");
if(userName!=null){
userName = new String(userName.getBytes("ISO-8859-1"), "utf-8");//解决乱码的问题
}
String returnString = "";
returnString="你好," + userName;
out.print(returnString); %>
</body>

show.jsp的代码:
<html>
<head>
<base href="<%=basePath%>">
<title>My JSP 'show.jsp' starting page</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<!--
<link rel="stylesheet" type="text/css" href="styles.css">
-->
<script type="text/javascript" src="jquery-1.3.2.min.js">
function doFind(){
$.ajax({
cache: true,
type: "POST",
url:"ajax.jsp", //把表单数据发送到ajax.jsp
data:$('#ajaxFrm').serialize(), //要发送的是ajaxFrm表单中的数据
async: false,
error: function(request) {
alert("发送请求失败!");},
success: function(data) {
$("#ajaxDiv").html(data); //将返回的结果显示到ajaxDiv中
}
});
}</script>
</head>
<body>
<form id="ajaxFrm" >
<input type="text" name="name">
<input type="button" onClick="doFind();" value="调用一下ajax" >
</form>
<div id="ajaxDiv"></div>
</body>
</html>
ajax.jsp的代码:
<body>
<%
String userName = request.getParameter("name");
if(userName!=null){
userName = new String(userName.getBytes("ISO-8859-1"), "utf-8");//解决乱码的问题
}
String returnString = "";
returnString="你好," + userName;
out.print(returnString); %>
</body>
...全文
相关推荐
jquery ajax 如何向jsp提交表单数据
总结来说,jQuery AJAX 提供了一套简洁的 API,使得向 JSP 等服务器端组件提交表单数据变得简单。无论是通过 URL 参数还是 Form 提交,都可以轻松地实现异步数据交互。
没有form表单情况下敲回车键提交表单的js代码
最后,描述中还提到了Ajax的应用,这表明在现代的web开发中,我们往往不仅仅依赖传统的form提交方式,还可能使用Ajax来实现异步的客户端验证和数据提交。
bootstrap Validator 模态框、jsp、表单验证 Ajax提交功能
本篇内容将详细介绍如何在Bootstrap模态框(modal)中集成Bootstrap Validator插件,并通过JSP页面和Ajax提交功能来实现表单验证,确保用户提交的数据符合预期要求。
JSP AJAX 无刷新表单验证
**JSP AJAX 无刷新表单验证**在Web开发中,用户交互体验是至关重要的,尤其是在填写表单时。传统的表单验证方式通常会在用户提交表单后进行服务器端的检查,这会导致页面的刷新,影响用户体验。
Ajax方式提交带文件上传的表单及隐藏iframe应用
在现代Web开发中,文件上传是一项常见的功能,但当涉及到Ajax无刷新提交时,问题就会变得复杂。Ajax通常不支持处理multipart/form-data类型的表单,这是由于文件上传所需的格式。


Web 开发
