zoukankan      html  css  js  c++  java
  • Dojo使用中的问题记录

    1、动态填充dijit.form.MultiSelect

    MultiSelect不支持dojo.data(即datastore),所以如果想把一个datastore动态填充进去,只能写一些javascript代码来动态创建那些<option>标签,基本上是通过myDataStore.fetch()来实现的。这个链接(Populating markup MultiSelect)值得参考。

    2、强制一个datastore从url里取得数据

    myDataStore._forceLoad();

    3、当datastore含有嵌套结构的时候,datastore.fetch()报错“dojo _48 is undefined”

    原因是在得到的json串里包含了"identifier"的声明,但嵌套结构里有一些对象没有包含所声明的属性。解决的方式1、让所有对象都包含该属性,2、去掉"identifier"声明(推荐1,因为我猜去掉这个声明后,在一些控件里将无法映射id值到html代码)参考链接1 参考链接2

    4、在dojo中响应事件

    请参考:JavaScript events and Dojo

    5、刷新BorderContainer

    有时需要动态隐藏BorderContainer里的一些区域(如left),若近将该区域的style.display设置为"none",则该区域所在的部分将变为空白,其他区域(如center)不会自动占领它原来的屏幕空间。这时需要调用dojo.byId('myBorderContainer').layout()方法手动让dojo重新计算一次布局,其他布局类似。一个相关链接(仅针对旧版本dojo)

    6、用dojo画统计图(柱图,饼图等)

    见这个教程:A Beginner's Guide to Dojo Charting (Part1, Part2)

    7、程序改变dijit.dialog的标题

    dijit.dialog并没有提供一个"setTitle"方法来控制标题内容,但可以通过dijit.byId('myDialog').titleNode.innerHTML='My New Title'来实现。参考链接

    8、BorderContainer里各个pane的显示和隐藏

    利用dojox.layout.ExpandoPane(尚不确定是否为experimental),使用的例子见这个链接

    9、将ItemFileWriteStore序列化为JSON字符串

    var foo=dojo.data.ItemFileWriteStore._getNewFileContentString();

    10、dojo的XHR(XmlHttpRequest) 里,handleAs可以有以下取值:

    text (default), json, json-comment-optional, json-comment-filtered, javascript, xml

    参考链接

    11、将DataStore里的数据以XHR方式发给服务器,并处理返回值

    在js里这样写:

    var data = scenarioEntryStore._getNewFileContentString();
     dojo.rawXhrPost({
      url: "http://127.0.0.1:8080/myapp/myservlet",
      handleAs: "text",
      postData: data,
      headers: {"Content-Type": "application/json"},
      handle: function (data, args) {
          if (typeof(data) == "error") {
           alert("Error run analysis");
          } else {
           alert("Successed run analysis");
           //do with result data
          }
      }
     });

    在myservlet里用下面的方法得到js传过来的json字符串,然后可以用任何java的json包来做解析和处理了:

    private String readJSONString(HttpServletRequest request) {
        StringBuffer json = new StringBuffer();
        String line = null;
        try {
            BufferedReader reader = request.getReader();
            while ((line = reader.readLine()) != null) {
                json.append(line);
            }
        } catch (Exception e) {
            System.out.println(e.toString());
        }
        return json.toString();
    }

    12、使用xhr的时候,如果不是在本机访问,可能会遇到“Access to Restricted URI Denied”的提示。

    一个可能的原因是xhr里的url的domain与访问者浏览器(或其他什么,这里没搞很清楚)的domain不一致,如果是这个原因,只要在url里使用相对路径就可以了。比如原来url是“http://127.0.0.1:8080/myapp/myservlet”的,改为“myservlet”即可。如果不是这个原因,这个链接可以参考一下。

    13、dojo里的单击事件是“onClick”,写成“onclick”不认。(但onchange是全小写,够奇怪)

    14、把json格式的数据画到dojo chart

    下面是一个把json数据转换到数组的例子,来自这个链接,实际上是利用prototype的能力。

    //JSON:
    str = “{values: [1,2,3,4,5]}”;
    //using prototype
    obj = str.evalJSON();
    //the array is then referenced by:
    chart1.addSeries(”Series 1″, obj.values);  

     下面这种方式则直接使用了json格式(来自这里),但关于valueFn这个参数的使用方法我还没找到一个比较完整的介绍:

    <div dojoType="dojox.charting.widget.Chart2D" id="chart4"
        theme="dojox.charting.themes.PlotKit.green"
        style=" 300px; height: 300px;">
      <div class="plot" name="default" type="Pie" radius="100"
          fontColor="black" labelOffset="-20"></div>
      <div class="series" name="Series C" store="tableStore" 
          valueFn="Number(x)"></div>
      <div class="action" type="Tooltip"></div>
      <div class="action" type="MoveSlice" shift="2"></div>
    </div> 

    15、可伸缩的pane

    使用ExpandoPane(//测试链接TODO)即可实现。要注意的是,ExpandoPane在dojo 1.3之前的版本里有bug,现象是包含抽屉pane时在IE下最下面的抽屉会被挤掉,在Firefox里则正常。dojo 1.3解决了这个问题。

    (如无特别说明,以上均针对dojo 1.3版本。 )

    (以下为dojo 1.6版本,dojo总是让人抓狂,一些好不容易获得的经验不得不快记下来) 

    16、 dojo chart的legend(图例)必须在chart.refresh()以后创建或refresh(),否则图例里不会正确显示颜色和形状,而是都为"X"。(参考链接

    17、 在tabcontainer里画的chart,refresh()的时候所在tab页是隐藏状态,切换过去后chart的尺寸不能充满tabcontainer区域。

    还不知道正确的方法是什么,一个权宜之计是在tab切换到chart所在tab时,调用一下chart的resize()方法,例如下面这样:

    dojo.subscribe("myTabContainer-selectChild", function(child){
        if(child.id=="myTab")
            myChart.resize();
    });

    如果觉得本文内容有帮助:试试我开发的Android应用 应用计时折扣君推荐+1(需登录)

  • 相关阅读:
    树莓派4 (1)一键配置
    Android编码学习之Fragment
    android编码学习
    自动化中app支持schema跳转
    jenkins持续集成
    测试环境运维文章集锦
    HTML5 data-* 自定义属性
    了解一下JavaScript的未来——ECMAScript5
    ECMAScript5的其它新特性
    ECMAScript5 Array新增方法
  • 原文地址:https://www.cnblogs.com/bjzhanghao/p/1430063.html
Copyright © 2011-2022 走看看