`
luccs624061082
  • 浏览: 82215 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
社区版块
存档分类
最新评论

ajax部分刷新提交

    博客分类:
  • ajax
阅读更多
   1 ajax部分刷新提交 做页面提交的时候 想使日历控件不刷新 但是其他刷新,这样显示出某天的内容。
    2 以前是整个form表单提交,致使日历控件刷新 显示当天日期 而不是选中的日期。选定某个日期,会执行跳转。要达到部分刷新,就需要使用ajax。
    思路:执行跳转后,不是整个form表单提交,而是整个页面不刷新,然后在后台中返回json数据 ,这里json可能疯转的是一个bean或者是一个list,返回到前端后,在ajax中返回数据中 取得这些值,然后赋值给相应的id。
    注意:1 在ajax的返回数据是json格式,因此提交的时候应该用
        $.getJSON(url,function(data)){}
    这里应该有三个参数,但是一般只用到两个,url:跳转路径,function(data)回调函数,data:返回值---这里是封转的json格式。
   2 在返回成功后要给jsp中相关的id重新赋值,不能用$("#content").val()
这是一个函数,汇报错误说是不能给函数值赋值,可以用document.getElementById('content').value取代。
 
  另外这里返回的json数据 是在后台进行封装的 有专门的类 JSONObject,JSONArray
  如果封转的是一个bean的话 new 一个JSONObject即可 这样在js中返回函数中 直接拿值 而不需要遍历。
   后台封转函数根据实际需要:
/**
* JSON数据封装--无刷新输出
* @param infos
* @return
*/
private JSONObject noFlushPrint(HealthLogs healthLogs) {
JSONObject member = null;
member = new JSONObject();
try {
if( healthLogs.getContent() == null){
member.put("content","");
}else{
member.put("content", healthLogs.getContent());
}

member.put("userId", healthLogs.getUserId());
member.put("smoke_num", Integer.valueOf(healthLogs.getSmoke_num()));
member.put("sleep_hour", Integer.valueOf(healthLogs.getSleep_hour()));
member.put("mood", Integer.valueOf(healthLogs.getMood()));
member.put("waistline", Integer.valueOf(healthLogs.getWaistline()));
member.put("weight", Integer.valueOf(healthLogs.getWeight()));
member.put("press", Integer.valueOf(healthLogs.getPress()));
} catch (Exception e) {
e.printStackTrace();
}
return member;
}  

这样返回到js中 直接取值赋值给相关数据
  如果封装的是一个list的话 new一个JSONObject 和 JSONArray 在js中返回函数中,需要进行遍历,
private JSONObject generateChartData(List<Sugar> infos) {
JSONObject json = new JSONObject();
JSONArray array = new JSONArray();
JSONObject member = null;
for (int i = 0; i < infos.size(); ++i) {
Sugar info = (Sugar) infos.get(i);
member = new JSONObject();
SimpleDateFormat dateformat = new SimpleDateFormat("yyyy-MM-dd");
member.put("date", dateformat.format(info.getTest_date()));
member.put("bloodsugar", Float.valueOf(info.getBlood_suger()));
array.add(member);
}
json.put("jsonArray", array);
return json;
}
这样返回到前台后,需要对此JSON进行遍历,然后赋值。

分享到:
评论

相关推荐

    南充人NET3.5开发的AJAX无刷新实例

    无刷新提交并保存,并用gridview显示出来,gridview 实现无刷新分页 vs2008己来一年多了 AJAX的应用可以说是VS2008的一个重要组成部分 在网上找了很多NETAJAX的应用,都是基于用HTML控件做的 直正用VS2008自带的...

    ASP.NET3.5 开发的 AJAX无刷新 留言本入门实例

    vs2008己来一年多了 AJAX的应用可以说是VS2008的一个重要组成部分 ... 直正用VS2008自带的AJAX控件的...无刷新提交并保存,并用gridview显示出来,gridview 实现无刷新分页 我想这一个例子足够用在很多方面了 ......

    框架之AJAX,ajax,页面部分刷新,实现动态提交数据到服务器;动态从服务区获取数据 get,post两种传递数据方法,Jso

    ajax,页面部分刷新,实现动态提交数据到服务器;动态从服务区获取数据。get,post两种传递数据方法,Json、html、text、xml等多种数据格式。

    Ajax无刷新在线查词

    内容索引:脚本资源,HTML,无刷新提交,AJAX AJAX无刷新在线查词,输入中文或英文,直接响应翻译结果,不刷新页面,方便快捷,带有音标注释及例句(部分单词无),用了jQuery的Ajax相关函数实现,同时兼容IE6,7,8,FF,...

    利用ajax提交form表单到数据库详解(无刷新)

    今天给大家带来的技术就是ajax提交表单 优点是不刷新页面,不跳转页面,静默提交的。 至于什么是ajax,自己去百度了解。 首先我们得要有一个表单提交页面: index.html 这个页面由两个部分组成 1、表单控件 2、...

    jQuery ajaxSubmit 实现ajax提交表单局部刷新

    AJAX 是与服务器交换数据并更新部分网页的艺术,在不重新加载整个页面的情况下。 需要引入 : jquery-form.js 使用说明: Java代码 $(document).ready(function() { var options = { target: '#mydiv', // 需要...

    基于AJAX技术的邮件系统

    浏览器不需要将整个页面提交到服务器,就能够实现页面的部分更新。并且在这一个与服务器交互过程中,用户不会感觉到页面被刷新。微软公司在ASP.NET 2.0之上也推出了AJAX技术,即ASP.NET AJAX技术。本章将介绍创建一...

    IE8用ajax访问不能每次都刷新的问题

    AJAX 是与服务器交换数据并更新部分网页的艺术,在不重新加载整个页面的情况下。 IE8用ajax访问不能每次都刷新的问题介绍如下: 最近发现,用ajax访问后台,用ie8访问,第一次可以正常返回值,后面就一直不会执行...

    基于jquery ajax 用户无刷新登录方法详解

    Ajax框架就是提供模块化实现Ajax功能的集合,Ajax框架可以是各种语言实现的(比如SAJAX有各种语言的实现),Ajax只是jquery中的一部分, 实例1 代码如下: $.ajax({ type:’post’,//可选get url:’action.php’,//...

    NET3.5 AJAX无刷新实例

    无刷新提交并保存,并用gridview显示出来,gridview实现无刷新分页 我想这一个例子足够用在很多方面了 注意实例要在英文的文夹里测试,好像是微软的AJAX对中文支持还不太好 数据库是2005的,备份和脚本都是2005的, ...

    Ajax实现带有验证码的局部刷新登录界面

    所有现在登录功能很少再用form表单post提交了,大多数都已经采用了ajax局部访问后台然后解析返回值并显示结果到界面上面。理论还是要拿来实践才能验证的,下面直接上代码。 运行界面: 1.验证码后台访问部分上一篇...

    Ajax课件学习(免费)

    XMLHttpRequest是XMLHTTP组件的对象,通过这个对象,AJAX可以像桌面应用程序一样只同服务器进行数据层面的交换,而不用每次都刷新界面,也不用每次将数据处理的工作都交给服务器来做;这样既减轻了服务器负担又加快...

    ajax总结.doc

    一些基础的ajax点,帮助大家在使用ajax的同时,能够更深入的了解和体验。有了Ajax之后,就可以实现在网页不跳转不刷新的情况下,在网页后台提交数据,部分更新页面内容。

    HTML页面局部刷新的实现代码

    2、通过Ajax将用户请求提交至服务器,服务器处理后返回结果,再由Ajax接收数据; 3、通过DOM方法或jQuery方法将数据载入页面,事件响应刷新完成。 $('#input_date').keypress(function(e){  if(e.keyCode=='13'){ ...

    AJAX打造博客无刷新搜索

    而大部分博客程序所带的搜索功能是提交查询关键字到搜索页面,然后在后台生成搜索结果,再呈现给用户,这过程之中浪费了一些带宽,如博客的侧边栏。要节约这一些带宽,我们可以用AJAX来打造自己的无刷新日志搜索。 ...

    Ajax-Gokart.zip

    Ajax-Gokart.zip,演示ajax模式的电子商务站点,如定期刷新、提交限制、隐藏iframes、多阶段下载、服务器发送事件(sse)等。,ajax代表异步javascript和xml。它是多种web技术的集合,包括html、css、json、xml和...

    使用Ajax更新ASP.Net MVC项目中的报表对象方法

    如果只刷新一部分页面,那就美滋滋了。而这正是Ajax所提供的。该脚本向服务器发送一个请求,以更新所需的部分信息。然后,脚本将更新的数据插入页面上的正确位置。 在这个页面中,我想用一个简单的方法通过Ajax更新...

    大名鼎鼎的IBM公司 Ajax 培训资料

    以迅速更新表单数据,让人感觉应用程序是立即完成的,表单没有提交或刷新而用户得到了新数据。 JavaScript 代码甚至可以对收到的数据执行某种计算,再发送另一个请求,完全不需要用户干预!这就 是 XMLHttpRequest ...

    AJAX基础概念、核心技术与典型案例(内涵动态实例)

    PostUser Ajax提交数据更新服务器内容 xmlhttpWeather 获取天气网站的内容 第11章(/C11/) 11.1.htm 采用标准的DOM方法创建一个表格并将其插入到页面中 11.2.htm 添加单元格 11.3....

    Django中的Ajax

    Django 是由 Python 开发的一个免费的开源网站框架,可以用于快速搭建高性能,优雅的网站!...jQuery中的ajax就可以实现不刷新页面就能向后台请求或提交数据的功能,我们仍然用它来做django中的ajax,所以先

Global site tag (gtag.js) - Google Analytics