ajax提交数据至jsp

ajax技术至今为止 被越来越多的人采用  主要原因也是因为它强大的无刷新功能   给服务器减少了不少压力, 那么究竟什么是ajax? 下面是我的一点心得

首先在eclipse里新建一个项目  这里我的是zy  如图:

我这里是集合mvc和mybatis集成的一个环境,为了节省时间  我就简单了 说一下 有以下几步:

然后创建一个jsp页面  这里是index.jsp    主要是一个form表单    然后是一个juqery函数:

启动服务器   打开浏览器  预览:

其次在创建一个ajax.jsp页面   该页面主要是接收ajax传递的参数   主要是以String 类型存储    同理也是以String类型传递接收  这里我们用jsp内置的九大对象之一的request 的一个方来获取

其截图 如图所示:

其效果就是  在控制台 输出传递的值  这里我们输出的是用户名和密码:

最后 :如果是传递到servlet道理也一样  基本代码一样   如果你涉及到对数据库的操作

你可以尽情玩耍   因为你已经取到值了 就可以”为所欲为“了。

这里我重新演示一遍:

在文本框输入

点击ajax提交按钮:

最后去控制台看是否有数据显示:

结果 大家可以看到的是 有正确的数据输出  至此一个简单的ajax提交表单数据基本完成   由于时间紧迫  界面不是很美观  请大家原谅

声明:这是本人第一次写这玩意   经验不是很多  如有问题请大家批评和指正

ps:这是我本人禽兽敲的  没有一点粘贴复制   如果觉得我写的还不错的话  请转摘自出处

时间: 2024-10-06 04:34:27

ajax提交数据至jsp的相关文章

JavaWeb开发中form、ajax提交数据Model转化

JavaWeb开发中form.ajax提交数据Model转化 问题 最近学习MongoDB数据库,作为java开发的我,当然需要做个小的web程序来测试一番了.在html中我采取ajax提交方式,因为我要模拟各种类型的数据,基础数据类型.数组.对象等.然而,最终发现了个不同的地方:Form和ajax提交数据,在HttpServletRequest中尽然参数名有所不同. 数据类型 form ajax 基础数据 para=value para=value 数组 para[]={"aaa",

jQuery 中 ajax 提交数据应用的一个小demo

举一个jquery中ajax的应用小 demo 便于以后的更多项目拓展 ,这里要注意的是保存的文件名问题 ... ajax02.html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title></title> </head> <body> <div id="form&qu

解决部分浏览器ajax提交数据,数据已改变,却后台数据接收数据还是上一次值的问题

最近在工作中遇到了QQ浏览器ajax提交数据,表单数据改变,却后台数据接收数据还是上一次值的问题,但是在其它浏览器中是正常的. 代码如下: $.ajax({ url : "<%=path%>/secretkey/uploadKey", async:false, type : 'post', data : { merKey : $('#merKey').val(), keyType : $('#keyType').val(), type : $('#type').val()

ajax提交数据问题

加入traditional:true属性 traditional 类型:Boolean 如果你想要用传统的方式来序列化数据,那么就设置为 true.请参考工具分类下面的 jQuery.param 方法. $.ajax({ type: "POST", url: url, traditional:true, data:{ data:[0,1] }, dataType: "json", async:false }); ajax提交数据问题

AJAX提交数据成功但不会跳转页面

HTML页面通过ajax提交数据成功,但是会执行多次success方法,不会跳转到指定页面 解决办法;把button的type改为button即可 1 <button type="button" id="addBtn" class="btn btn-primary btn-lg">添加</button> 2 3 <script type="text/javascript"> 4  $(&qu

ajax提交数据,回调函数不执行或总是执行error回调函数的问题

jsp页面: <form id="itemAddForm" class="itemForm" method="post"> <div id="tab1" class="tabcontent"> <div class="form"> <div class="form_row"> <label><b>

博客园项目-登录(验证码,ajax提交数据,session和cookie)

前端页面 {% load static %} <!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8"> <meta http-equiv="x-ua-compatible" content="IE=edge"> <meta name="viewport" content

js序列化数组用于ajax提交数据

但我们要用ajajx提交类似于: array('id' =>12,data => array('a'=>1,'b'=>2)); 这样的二维数组的数据时,直接ajax提交后台是接收不到的,需要特殊处理下: //这里只能处理二维数组数据,多维的需在做循环或递归function serialize_data(obj){ var str = ''; for(var i in obj){ if(typeof(obj[i]) === 'object'){ for(var s in obj[i]

向后台提交数据:通过form表单提交数据需刷新网页 但通过Ajax提交数据不用刷新网页可通过原生态Ajax或jqueryAjax。Ajax代码部分

原生态Ajax提交表单:需要借助XMLHttpRequest对象的open,要收通过post发送请求还要setRequsetHeader,然后把数据发送给后端,代码如下 目录结构 index.py代码 1 #index.py 2 #!/usr/bin/env python 3 #-*- coding:utf-8 -*- 4 import tornado.web 5 import tornado.ioloop 6 class indexHandler(tornado.web.RequestHand