1

私は動的にdojox.mobile.ListItems を aに追加しようとしdojox.mobile.RoundRectListていますが、比較的単純なものに苦労しています。

これは私の道場ウィジェットです:

<ul data-dojo-type="dojox.mobile.RoundRectList" id="theTable" >
        <li data-dojo-type="dojox.mobile.ListItem"
            data-dojo-props='icon:"images/i-icon-1.png",
                            moveTo:"#article",
                            variableHeight:true' 
            id="theItem">
            text here
        </li>
    </ul>

私は少しのjavascriptを持っており、それによってハンドルをつかんRoundRectListでそれにいくつかListItemの s を追加しようとしています:

dojo.require("dojox.mobile.parser");
dojo.require("dojox.mobile");
dojo.requireIf(!dojo.isWebKit, "dojox.mobile.compat");
var theTable = dojo.byId("theTable");
var childWidget = new dojox.mobile.ListItem({
                   id:"item1", 
                   icon:"images/icon.png", 
                   rightText:"Off", 
                   moveTo:"bar", 
                   label:"u1space"});
theTable.addChild(childWidget);

これは機能していないようです。具体的には、Chrome の Javascript コンソールに次のエラーが表示されます。

キャッチされていない TypeError: 未定義のメソッド 'addChild' を呼び出せません

ここで私が間違っていることについて、誰かが私にアドバイスしてもらえますか? 基本的に、繰り返し処理して要素をリストに入れようとしている JSON オブジェクトがあります。

ありがとう

4

3 に答える 3

4

Dojo ウィジェットにアクセスするには、dojo.byId ではなく dijit.byId を使用する必要があります。dojo.byId は、ウィジェット化されていない DOM ノードにアクセスするために使用されます。以下に例を示しますが、単純な dojox.mobile.RoundRectList ではなく、dojox.mobile.RoundRectDataList を調べることをお勧めします。データ・リスト・バージョンは dojo.data.store によってサポートされており、動的更新がはるかに容易になります - http://livedocs.dojotoolkit.org/dojox/mobile/RoundRectDataList 

    <!DOCTYPE HTML>
    <html>
    <head>
    <title>index</title>
    <meta name="viewport" content="width=device-width,initial-scale=1,maximum- scale=1,minimum-scale=1,user-scalable=no"/>
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

    <script src="http://ajax.googleapis.com/ajax/libs/dojo/1.7.2/dojo/dojo.js" data-dojo-config="async: true"></script>
   <script type="text/javascript">
   require(["dojox/mobile/parser",
            "dijit/registry",
            "dojox/mobile/deviceTheme",
            "dojox/mobile",
            "dojo/domReady!"],function(parser,registry){
             parser.parse();
             var list = registry.byId("list");
             var childWidget = new dojox.mobile.ListItem({id:"item1", 
                                                              icon:"images/icon.png", 
                                                              rightText:"Off", 
                                                              moveTo:"bar", 
                                                              label:"u1space"});
             list.addChild(childWidget);
           });
    </script>

  </head>
  <body>

  <div id="settings" data-dojo-type="dojox.mobile.View" data-dojo-props="selected: true">

  <!-- a sample heading -->
  <h1 data-dojo-type="dojox.mobile.Heading">Settings</h1>

  <!-- a rounded rectangle list container -->
  <ul data-dojo-type="dojox.mobile.RoundRectList" id="list">

     <li data-dojo-type="dojox.mobile.ListItem" data-dojo-props='moveTo:"article"' id="theItem">
        Go to Article view
    </li>
  </ul>
  </div>

  <div id="article" data-dojo-type="dojox.mobile.View">

    <!-- a sample heading -->
    <h1 data-dojo-type="dojox.mobile.Heading" data-dojo-props='back: "settings",moveTo: "settings"'>Article</h1>

    This is the article view
  </div>
</body>
</html>
于 2012-07-27T15:31:53.527 に答える
0

エラー メッセージは、theTable 変数が addChild() 関数を持つオブジェクトを指していないことを示しているようです - dojo.byId() が失敗したことを意味します。

最初にテーブルの内容を確認することをお勧めします。

比較のために、私はあなたがやろうとしているようなことをしている作業コードを持っていますが、私は少し異なるイディオムを使用しています:

私は独自のウィジェットを作成しているので、attachPoint - dapTaskList を使用して、リストを配置する場所へのハンドルを取得し、リストを最初から作成しています。

var ul  = new RoundRectList({}, domConstruct.create("ul",{}, this.dapTaskList) );
ul.startup();

次に、次のようなコードでアイテムを追加します。

        li = new ListItem({
          "label"          : "xx",
          "rightText"      : 997, 
          "class"          : "subTotalListItem"
        }, domConstruct.create("li",{}, ul.domNode) );
        li.startup();
于 2012-07-26T12:43:22.117 に答える
0

これが問題の原因であるかどうかは 100% 正確にはわかりませんが、dojo.placeJavaScript/DOM API を使用するのではなく、おそらく Dojo API (具体的には ) を使用して、この ListItem をリスト内に配置する必要があります。例えば

dojo.place(childWidget.domNode, theTable)

http://dojotoolkit.org/reference-guide/1.7/dojo/place.html

于 2012-07-26T12:26:27.257 に答える