dojo ajax post 和 get 的方法的使用, formData 提交 Enumeration<String> enumx = request.getParameterName()

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

.

  • 0
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>通过属性查询地图服务中的信息</title> <link rel="stylesheet" href="https://js.arcgis.com/3.39/esri/css/esri.css"> <!-- <link rel="stylesheet" type="text/css" href="./css/esri.css" /> --> <link rel="stylesheet" href="https://js.arcgis.com/3.40/esri/themes/calcite/dijit/calcite.css"> <script src="https://js.arcgis.com/3.41/"></script> <script> require(["esri/map", //加载地图组件 "dojo/dom", "dojo/on", "esri/InfoTemplate", "esri/graphic", "esri/geometry/Point",//加载点对象组件 "esri/symbols/SimpleMarkerSymbol", "esri/geometry/Extent",//加载范围组件 "esri/layers/FeatureLayer", //加载FeatureLayer地图组件 // "esri/dijit/FeatureTable", "esri/layers/WebTiledLayer", //加载切片地图组件 "esri/layers/ArcGISDynamicMapServiceLayer",//加载动态地图组件 "esri/symbols/SimpleFillSymbol", "esri/renderers/UniqueValueRenderer", "esri/tasks/query", "esri/tasks/QueryTask", "esri/Color", "dojo/domReady!" ], function (Map, dom, on, InfoTemplate, Graphic, Point, SimpleMarkerSymbol,Extent, FeatureLayer, WebTiledLayer, ArcGISDynamicMapServiceLayer, SimpleFillSymbol, UniqueValueRenderer, Query, QueryTask, Color, GeoJsonLayer) { //初始化地图容器 // map = new Map("map", { logo: false, slider: false }, {zoom: 8}); map = new Map("map", { center: [109.33789 , 29.57985], basemap: "satellite", zoom: 10, sliderStyle: "small", logo: false }); // 创建底图 var basemap = new esri.layers.ArcGISTiledMapServiceLayer("http://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer"); map.addLayer(basemap,0); // 创建动态图层 var dynamicLayer = new ArcGISDynamicMapServiceLayer("http://116.62.63.94:6080/arcgis/rest/services/sanhuxiangtest/MapServer"); map.addLayer(dynamicLayer,99); }) </script> </head> <body class="tundra"> <div id="map" style="width:900px; height:580px; border:1px solid #000;"></div> 类别名称:<input class="nm" type="text"> </body> </html>
最新发布
07-15

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值