Dojo初探之5:dojo的request(请求)操作、请求过程事件绑定和隐藏数据data()操作(基于dojo1.11.2版本)
前言:
上一章详细阐述了dojo的事件绑定操作,本章将讲解dojo的请求操作
注:dojo的请求操作与js和jquery完全不同!
1、dojo的请求
dojo通过request.get()/.put()/.post()/.del()进行请求操作
request.post("这里放对应的请求接口地址", {
//解析服务器json数据
handleAs: "json",
// 直接从form表单取json对象作为参数
data: domForm.toObject("formNode"),
// 超时时间
timeout: 2000
}).then(function(response) {
//正确获得服务器响应后的操作
dom.byId('svrMessage').innerHTML = JSON.stringify(response);
});
2、请求的过程中可以绑定不同操作
//请求过程事件绑定
require(["dojo/dom", "dojo/request", "dojo/request/notify",
"dojo/on", "dojo/dom-construct", "dojo/query",
"dojo/domReady!"
],
function(dom, request, notify, on, domConstruct) {
//开始
notify("start", function() {
domConstruct.place("<p>开始</p>", "divStatus");
});
//发送
notify("send", function(data, cancel) {
domConstruct.place("<p>发送请求</p>", "divStatus");
});
//请求成功
notify("load", function(data) {
domConstruct.place("<p>加载完毕</p>", "divStatus");
});
//请求失败
notify("error", function(error) {
domConstruct.place("<p class=\"error\">加载失败</p>", "divStatus");
});
//已经完成之后
notify("done", function(data) {
domConstruct.place("<p>请求结束 (response processed)</p>", "divStatus");
if (data instanceof Error) {
domConstruct.place("<p class=\"error\">响应失败</p>", "divStatus");
} else {
domConstruct.place("<p class=\"success\">响应成功</p>", "divStatus");
}
});
//停止
notify("stop", function() {
domConstruct.place("<p>请求停止</p>", "divStatus");
domConstruct.place("<p class=\"ready\">准备</p>", "divStatus");
});
on(dom.byId("test"), "click", function(evt) {
//清空id为divStatus内部元素
domConstruct.empty("divStatus");
request.get("getTime", //请求地址
{
query: this.id = "successbtn",
handleAs: "json" //返回的是json数据
}).then(function(data) {
//发送请求成功后的操作
alert("获取成功" + data.data);
//发送请求失败后的操作
}, function(error) {
alert("获取失败" + error);
});
});
}
);
3、与jquery相似,dojo也提供隐藏数据的data()操作
要进行data()操作必须引入NodeList-data和NodeList-manipulate模块
如下所示
var NodeList = require(["dojo/NodeList-data", "dojo/NodeList-manipulate", "dojo/domReady!"], function(NodeList) {
//设置隐藏数据
function setData(node) {
query(node).data("updated", new Date());
}
//获取隐藏数据
function getData(node) {
var str = query(node).data("updated");
console.log(str);
}
到这里dojo的常用操作部分基本讲解完毕了,dom操作可以操作页面增删改,事件绑定操作处理事件绑定,本章请求处理用于处理get/post/put/delete四种请求,普通页面操作基本都可以做到了,后面如果发现前面漏掉的地方将会进一步进行补充。
接下来将开始dojo的高级部分学习
Dojo初探之5:dojo的request(请求)操作、请求过程事件绑定和隐藏数据data()操作(基于dojo1.11.2版本)的更多相关文章
- Dojo初探之3:dojo的DOM操作、query操作和domConstruct元素位置操作(基于dojo1.11.2版本)
前言: 前面两章讲了dojo的基本规范和配置,当然这个配置不是必须的,当你有这需求的时候就可以用到dojo的config配置. dojo的所有js都是符合AMD规范进行异步加载的:http://blo ...
- Dojo初探之4:dojo的event(鼠标/键盘)事件绑定操作(基于dojo1.11.2版本)
前言: 上一章详解了dojo的dom/query操作,本章基于dom/query基础上进行事件绑定操作 dojo的事件 dojo的事件绑定操作分为鼠标和键盘两种进行详解 1.鼠标事件 我们沿用上一章中 ...
- Dojo初探之2:设置dojoConfig详解,dojoConfig参数详解+Dojo中预置自定义AMD模块的四种方式(基于dojo1.11.2)
Dojo中想要加载自定义的AMD模块,需要先设置好这个模块对应的路径,模块的路径就是这个模块的唯一标识符. 一.dojoConfig参数设置详解 var dojoConfig = { baseUrl: ...
- Dojo初探
Dojo 是一个由 Dojo 基金会开发的 Javascript 工具包, 据说受到 IBM 的永久支持,其包括四个部分: dojo, dijit, dojox, util dojo: 有时也被称作 ...
- dojo事件驱动编程之事件绑定
什么是事件驱动? 事件驱动编程是以事件为第一驱动的编程模型,模块被动等待通知(notification),行为取决于外来的突发事件,是事件驱动的,符合事件驱动式编程(Event-Driven Prog ...
- Configuring Dojo with dojoConfig - The Dojo Toolkit
转载自Dojo官网 Configuring Dojo with dojoConfig The dojoConfig object (formerly djConfig) allows you to s ...
- dojo/Deferred类和dojo/promise类的使用
参考博客:https://blog.csdn.net/blog_szhao/article/details/50220181 https://dojotoolkit.org/docume ...
- (ExtJs 3.4)Ext.Ajax.request的同步请求实现
ext3.0之前都是这样来提交:var responsea = Ext.lib.Ajax.getConnectionObject().conn;responsea.open("POST&qu ...
- Volley(二)—— 基本Request对象 & RequestQueue&请求取消
详细解读Volley(一)—— 基本Request对象 & RequestQueue&请求取消 Volley它非常适合去进行数据量不大,但通信频繁的网络操作,而对于大数据量的网络操作, ...
随机推荐
- 财付通API
开发财付通API的步骤: 1.首先开发财付通API时先获取商户号和密钥: 财付通测试号:商户号String partner = "1900000109";密钥String key ...
- C++ 窗口可改风格
SetWindowLong(m_hWnd,GWL_STYLE,::GetWindowLong(m_hWnd,GWL_STYLE)& ~WS_MAXIMIZEBOX);//去掉最大化 GWL_S ...
- 好看的复选框(Checkbox)效果
在线演示 源码下载
- JVM 堆内存,参数优化
Java堆内存 http://www.importnew.com/19593.html JVM诊断之查看运行参数 JVM 垃圾回收器工作原理及使用实例介绍 https://www.ibm.com/de ...
- (转载)Linux查看文件编码格式及文件编码转换
Linux查看文件编码格式及文件编码转换 时间:2011-04-08作者:woyoo分类:linux评论:0 我友分享: 新浪微博 腾讯微博 搜狐微博 网易微博 开心网 QQ空间 msn 如果你需要在 ...
- 蓝桥杯-隔行变色-java
/* (程序头部注释开始) * 程序的版权和版本声明部分 * Copyright (c) 2016, 广州科技贸易职业学院信息工程系学生 * All rights reserved. * 文件名称: ...
- (jquery+ajax)省市区三级联动(封装和不封装两种方式)-----2017-05-14
首先,要实现如下图效果, 1.要理清思路: 先做出三个下拉菜单----根据第一个下拉菜单的value值获取第二个下拉列表的内容,第三个同理. 2.用到的数据库表:Chinastates表 规律:根据国 ...
- 浅谈 Java Xml 底层解析方式
XML 使用DTD(document type definition)文档类型来标记数据和定义数据,格式统一且跨平台和语言,已成为业界公认的标准. 目前 XML 描述数据龙头老大的地位渐渐受到 Jso ...
- java面试集锦
HashMap和HashTable的区别 他们都是Map接口的实现类,实现了将唯一键值映射到特定的值上. HashMap没有分类或者排序,它允许一个null和多个null值. HashTable类似于 ...
- Eclipse 扩展activiti-desinger 安装
activiti-desinger 工作流画图工具分为在线安装.离线安装两种方式:下图提供当前所用eclipse版本信息 1.1 在线安装 打开Eclipse -> Help -& ...