現在位置: start » study » javascript » dojo » select

差分

このページの2つのバージョン間の差分を表示します。

この比較画面へのリンク

両方とも前のリビジョン前のリビジョン
次のリビジョン		前のリビジョン
study:javascript:dojo:select [2009/05/08 10:41] – bananastudy:javascript:dojo:select [2010/07/26 11:32] (現在) – banana
行 4: 行 4:
 今回の例では、表示するデータを**JSON**(%%JavaScript Object Notation%%)で保存してある。 今回の例では、表示するデータを**JSON**(%%JavaScript Object Notation%%)で保存してある。
 ツリーの構造は**%%Dojo Campus%%**(([[http://dojocampus.org/explorer/#Dijit_Tree_Basic|Digit Tree Component]]))から確認できる。 ツリーの構造は**%%Dojo Campus%%**(([[http://dojocampus.org/explorer/#Dijit_Tree_Basic|Digit Tree Component]]))から確認できる。
-あるいは、次節で示す**JSON**データを**JSON Editor**(([[http://braincast.nl/samples/jsoneditor/]] : JSON Editor))にコピーして確認することも可能である。+あるいは、次節で示す**JSON**データを**JSON Editor**(([[http://braincast.nl/samples/jsoneditor/|JSON Editor]]))にコピーして確認することも可能である。
 {{keywords>Dynamic select box json dojo tree}} {{keywords>Dynamic select box json dojo tree}}
  
行 86: 行 86:
 </code> </code>
  
-ここで、利用するのがdojoのコアパッケージにある%%**ItemFileReadStore**%%である。+ここで、利用するのがdojoのコアパッケージにある**%%ItemFileReadStore%%**である。
  
 次は読み込んだ**JSON**から初期リストを出力するコードを示す。 次は読み込んだ**JSON**から初期リストを出力するコードを示す。
行 96: 行 96:
         onComplete: function( items ) {             onComplete: function( items ) {   
          dojo.forEach( items, function(item, count) {          dojo.forEach( items, function(item, count) {
-              var opt=document.createElement('option'); +      var opt=document.createElement('option'); 
-       opt.appendChild(document.createTextNode(store.getValue( item, "name" ))); +       opt.appendChild(document.createTextNode(store.getValue( item, "name" ))); 
-       opt.setAttribute('value',store.getValue( item, 'index')); +       opt.setAttribute('value',store.getValue( item, 'index')); 
-   dojo.byId('continent').appendChild(opt); +   dojo.byId('continent').appendChild(opt); 
-       });      +            });      
-        },+   },
   onError: function(e) {   onError: function(e) {
          console.error( "!!!!",arguments );          console.error( "!!!!",arguments );
-  }+  }, 
 +        sort: sortAttributes 
    });    });
    showFirstChildren('continent','country');    showFirstChildren('continent','country');
行 134: 行 135:
       onError: function(e) {       onError: function(e) {
          console.error( "!!!!",arguments );          console.error( "!!!!",arguments );
-      }+      }, 
 +      sort: sortAttributes
    });    });
 }//showFirstChildren }//showFirstChildren
行 148: 行 150:
 function onChange(item, parent, child){ function onChange(item, parent, child){
    var val = item.options[item.selectedIndex].text;    var val = item.options[item.selectedIndex].text;
-   store.fetch( { query: { type: parent },+   store.fetch( { query: { type: parent, name:val },
       onComplete: function( items ) {       onComplete: function( items ) {
          dojo.forEach( items, function( item ) {          dojo.forEach( items, function( item ) {
-        if(val == store.getValue( item, "name" )){+        
         dojo.forEach(child, function(e){         dojo.forEach(child, function(e){
            if(e) dojo.byId(e).innerHTML="";                           if(e) dojo.byId(e).innerHTML="";               
行 164: 行 166:
         });         });
  });  });
-      }//if+      
    });    });
  },   },
行 255: 行 257:
 function onChange(item, parent, child){ function onChange(item, parent, child){
    var val = item.options[item.selectedIndex].text;    var val = item.options[item.selectedIndex].text;
-   store.fetch( { query: { type: parent },+   store.fetch( { query: { type: parent, name:val },
       onComplete: function( items ) {       onComplete: function( items ) {
          dojo.forEach( items, function( item ) {          dojo.forEach( items, function( item ) {
-        if(val == store.getValue( item, "name" )){+        
         dojo.forEach(child, function(e){         dojo.forEach(child, function(e){
     if(e) dojo.byId(e).innerHTML="";                    if(e) dojo.byId(e).innerHTML="";               
行 271: 行 273:
                   });                   });
  });  });
-      }//if+      
    });    });
  },   },
行 297: 行 299:
 </head> </head>
 <body> <body>
 +
 <select id="continent"><option value=""></option></select><br/> <select id="continent"><option value=""></option></select><br/>
 <select id="country"><option value=""></option></select><br/> <select id="country"><option value=""></option></select><br/>
行 303: 行 306:
 </html> </html>
  
 +~~DISCUSSION~~

トレース: • z-index • select_2 • select • prevent_paste

QR Code
QR Code study:javascript:dojo:select (generated for current page)