jquery ajax 如何向jsp提交表单数据

<%@ page contentType="text/html;charset=GBK"%>

<script type="text/javascript" src="/UploadFiles/2021-04-02/jquery-1.3.2.min.js">

2、设置表单的id，在调用ajax的方法时要用到。


<form id="ajaxFrm" >


3、设置一个div，用于显示ajax.jsp页面返回的结果


<div id="ajaxDiv"></div>


4、增加一个按钮，用来调用ajax


<input type="button" onClick="doFind();" value="调用一下ajax" >


5、增加调用ajax的函数：


function doFind(){

$.ajax({

cache: false,

type: "POST",

url:"ajax.jsp", //把表单数据发送到ajax.jsp

data:$('#ajaxFrm').serialize(), //要发送的是ajaxFrm表单中的数据

async: false,

error: function(request) {

alert("发送请求失败！");

},

success: function(data) {

$("#ajaxDiv").html(data); //将返回的结果显示到ajaxDiv中

}

});

}


ajax.jsp页面的源代码：


<%@ page contentType="text/html;charset=GBK"%>

<%

String userName = request.getParameter("UserName");

if(userName!=null){

userName = new String(userName.getBytes("ISO-8859-1"), "utf-8");//解决乱码的问题

}

String returnString = "";

returnString="你好，" + userName;

out.print(returnString);

%>


运行效果如下：


jquery ajax提交表单从action传值到jsp
jsp页面：
代码如下:


var clientTel = $("#clientTel").val(); 
var activityId = $("#activityId").val(); 
$.ajax({ 
type : "post",//发送方式 
url : "/arweb/reserve/saveCode.action",// 路径 
data : "clientTel="+clientTel+"&activityId="+activityId , 
success: function(text){$("#randomCode").val(text);}, 
error: function(text) {alert("对不起,用户ID不存在,请输入正确的用户ID");} 
}); 


acion类：
代码如下:


HttpServletResponse res = ServletActionContext.getResponse(); 
res.reset(); 
res.setContentType("text/html;charset=utf-8"); 
PrintWriter pw = res.getWriter(); 
pw.print(random); 
pw.flush(); 
pw.close(); 


pw.print(random);这里的random就是action要向jsp传的值，在jsp中，success: function(text)这里的text就是接收从action传过来的值。