dojo ajax post 和 get 的方法的使用

dojo ajax post 的方法的使用

dojo 是非常强大的前端开发平台，对标签、JS 都有着完善的操作机制，以下举例 dojo 向服务器 post 和 get 的实例：

1、数据来自 from 的 dojo post 操作

function sendForm(){
var form = dojo.byId("myform");

dojo.connect(form, "onsubmit", function(event){
// Stop the submit event since we want to control form submission.
dojo.stopEvent(event);

// The parameters to pass to xhrPost, the form, how to handle it, and the callbacks.
// Note that there isn't a url passed.  xhrPost will extract the url to call from the form's
//'action' attribute.  You could also leave off the action attribute and set the url of the xhrPost object
// either should work.
var xhrArgs = {
form: dojo.byId("myform"),
handleAs: "text",
load: function(data){
dojo.byId("response").innerHTML = "Form posted.";
},
error: function(error){
// We'll 404 in the demo, but that's okay.  We don't have a 'postIt' service on the
// docs server.
dojo.byId("response").innerHTML = "Form posted.";
}
}
// Call the asynchronous xhrPost
dojo.byId("response").innerHTML = "Form being sent..."
var deferred = dojo.xhrPost(xhrArgs);
});
}
dojo.ready(sendForm);

2、数据直接在 js 内构建的 dojo post 操作

function sendText(){
var button = dijit.byId("submitButton2");

dojo.connect(button, "onClick", function(event){
// The parameters to pass to xhrPost, the message, and the url to send it to
// Also, how to handle the return and callbacks.
var xhrArgs = {
url: "postIt",
postData: "Some random text",
handleAs: "text",
load: function(data){
dojo.byId("response2").innerHTML = "Message posted.";
},
error: function(error){
// We'll 404 in the demo, but that's okay.  We don't have a 'postIt' service on the
// docs server.
dojo.byId("response2").innerHTML = "Message posted.";
}
}
dojo.byId("response2").innerHTML = "Message being sent..."
// Call the asynchronous xhrPost
var deferred = dojo.xhrPost(xhrArgs);
});
}
dojo.ready(sendText);

3、数据以 json 方式提交的 dojo post 操作

function sendText(){
var button = dijit.byId("submitButton2");

dojo.connect(button, "onClick", function(event){
// The parameters to pass to xhrPost, the message, and the url to send it to
// Also, how to handle the return and callbacks.
var xhrArgs = {
url: "{{baseUrl}}dojo/dojo.js",
postData: dojo.toJson({key1:"value1",key2:{key3:"value2"}}),
handleAs: "text",
load: function(data){
dojo.byId("response2").innerHTML = "Message posted.";
},
error: function(error){
// We'll 404 in the demo, but that's okay.  We don't have a 'postIt' service on the
// docs server.
dojo.byId("response2").innerHTML = "Message posted.";
}
}
dojo.byId("response2").innerHTML = "Message being sent..."
// Call the asynchronous xhrPost
var deferred = dojo.xhrPost(xhrArgs);
});
}
dojo.ready(sendText);

postData 以 json 或 text 传入，尤其是针对传入参数结构不定的情况，service 获取参数 java 代码如下：

Enumeration<String> enumeration = request.getParameterNames();
while (enumeration.hasMoreElements() == true)
{
String strParameterName = enumeration.nextElement().toString();
String strValue = request.getParameter(strParameterName);
............
}

4.以参数及变量形式的 dojo 提交

function sendText();
{
var xhrArgs = {
url : "/service/path",
content : {
name : 'your name',
data1 : 'data1',
data2 : 'data2',
data3 : 'data3',
},
handleAs : "text",
// 同步,默认 false
sync: true,
load : function(data)
{
console.debug(data);
},
error : function(error)
{
console.debug(data);
}
}
var deferred = dojo.xhrPost(xhrArgs);
}

上面全是 post 方式，get 方式几乎一样

dojo.ready(function(){
// Look up the node we'll stick the text under.
var targetNode = dojo.byId("licenseContainer");

// The parameters to pass to xhrGet, the url, how to handle it, and the callbacks.
var xhrArgs = {
url: "{{dataUrl}}dojo/LICENSE",
handleAs: "text",
load: function(data){
// Replace newlines with nice HTML tags.
data = data.replace(/\n/g, "<br>");

// Replace tabs with spaces.
data = data.replace(/\t/g, "   ");

targetNode.innerHTML = data;
},
error: function(error){
targetNode.innerHTML = "An unexpected error occurred: " + error;
}
}

// Call the asynchronous xhrGet
var deferred = dojo.xhrGet(xhrArgs);
});

通过以下命令将字符串转化为 JS 对象

JSON.parse('{}');              // {}
JSON.parse('true');            // true
JSON.parse('"foo"');           // "foo"
JSON.parse('[1, 5, "false"]'); // [1, 5, "false"]
JSON.parse('null');            // null

将 JS 对象转化为字符串

JSON.stringify({});                  // '{}'
JSON.stringify(true);                // 'true'
JSON.stringify('foo');               // '"foo"'
JSON.stringify([1, 'false', false]); // '[1,"false",false]'
JSON.stringify({ x: 5 });            // '{"x":5}'

dojo 提交参数中，有一项 handleAs:"text"，即表示返回信息的类型，若需要返回的是
json，则需要把 handleAs:"text"
改为 handleAs:"json"，这样的话，JSON.parse()
将正确转换 string 串为 object 类型。

以上参考来自
http://dojotoolkit.org/reference-guide/1.10/dojo/xhrPost.html https://dojotoolkit.org/reference-guide/1.10/dojo/xhrGet.html https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/JSON/parse https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/JSON/stringify
Q群讨论 236201801

.