0

Ext.data.TreeStore と Ext.data.Model で Ext.tree.Panel を使用しようとしています。私は正しいことをしていると思いますが、ツリーをチェックすると美しい「ヌル」が表示されます。これは正常ではありません。そして、それは私のjson URLが原因である可能性があると思います。

私がどのように進めているかを説明しましょう。モデルを定義する方法は次のとおりです。

Ext.define('SelectedModel', {
 extend: 'Ext.data.Model',
 fields: [
    {name: 'text', type: 'string'},
    {name: 'id',  type: 'string'},
    {name: 'leaf', type: 'bool'},
    {name: 'children',  type: 'auto'},
    {name: 'singleClickExpand',  type: 'bool'},
    {name: 'status',  type: 'int'},
    {name: 'checked', type: 'boolean'},
    {name: 'fullIceCode',  type: 'string'},
    {name: 'withMenu',  type: 'bool'},
 ]
});

フィールド「葉」と「子供」はデフォルトですべてのツリーに存在することを読みました(他に20個のフィールドがあります)。だから私はそれらに言及しなければならないかどうかわかりません。これらのフィールドはすべて、まさに私の json 応答に存在するものです (ただし、以下の例でわかるように、すべての項目に常に存在するとは限りません)。ExtJS の仕組みがよくわからないので (これは練習の最初の 1 週間です)、json 応答に存在するすべてのフィールドをモデルに書き込む必要があるのか​​ 、それともすべてのアイテムに存在するフィールドだけを記述する必要があるのか​​ 疑問に思っています私のツリー。

ツリーでストアを定義する方法を見てみましょう。

store: Ext.create("Ext.data.TreeStore",{
         model: 'SelectedModel',
         proxy: {
               type: 'ajax',
                url: this.myaction,
                reader: {
                        type: 'json',
                }
         }  
})

Tree コンストラクターの最後に、console.log(this.myaction) を書き込むと、必要なものを正確に取得できます。これは「stSearchAction.do?action=product_tree」です。この URL は、json 応答をサーブレットに設定する URL です。それはこの方法につながります:

private ActionForward getSpecialToolProductTree(
        HttpServletRequest request, HttpServletResponse response) throws SystemException, ApplicativeException  {

    if (strJsonProduct == null)
    {
        strJsonProduct = getAndCreateSessionIfNeeded(request).getStrJsonProductSelector();
    }
    System.out.println(strJsonProduct);
    setResponse(response, strJsonProduct) ;

    return null ; 
}

あなたが見ることができる System.out.println(strJsonProduct) は、私が望むjson文字列を正確に示しています:

[{text : 'CASE CONSTRUCTION', id : '5 -122001754' , leaf : false , children : [{text : 'Engines', ... ... ... ... ... ... ..., singleClickExpand : true , status : 1 , checked : false , fullIceCode : 'Y.A.01.001', withMenu : true }
] , singleClickExpand : true , status : 1 }] , singleClickExpand : true , status : 1 }] , singleClickExpand : true , status : 1 }]

今のところどこに問題があるのか​​ わかりませんが、私は時々かなり盲目になることがあることを認めます.

今ツリー:

Ext.define('Application.TreePanel', {
extend: 'Ext.tree.Panel',
requires: ['Ext.data.TreeStore'],
myaction: 'Unknown Url',
myrender: 'Unknown Render',
xtype: 'check-tree',       
rootVisible: false,
useArrows: true,
frame: true,
title: 'Unknown title',
width: 250,
height: 300,

constructor: function(myaction, mywidth, myheight, myrender, mytitle) {
    if (myaction) {
        this.myaction = myaction;
    }
    if (myrender) {
        this.myrender = myrender;
    }
    if (mytitle) {
        this.title = document.getElementById(mytitle).innerHTML;
    }
    if (mywidth) {
        this.width = mywidth;
    }
    if (myheight) {
        this.height = myheight;
    }
    console.log(this.height);
 },

 config:{
     renderTo: this.myrender,


     store: Ext.create("Ext.data.TreeStore",{
         model: 'SelectedModel',
         proxy: {
               type: 'ajax',
                url: this.myaction,
                reader: {
                        type: 'json',
                }
            }   
     })
 }

});

コンストラクターに設定されたさまざまな属性をconsole.logで確認すると、まさに必要なものが得られました...お見せしたすべてのextJsコードは同じファイルtree421.jsにあります(ExtJS 4.2.1を使用しているため)。私のストアに問題があると思います。正しいことをしていません。おそらく、これはプロキシの URL 構成を使用する方法ではありません...しかし、良い方法が見つかりません。

奇妙な結果が得られます。私のtree421.jsの最後でこれらの行を実行すると

var tree = Ext.create("Application.TreePanel", 'stSearchAction.do?action=product_tree', 300, 270, 'tree-div', 'lbl_st_tree_selection');
console.log(tree);
console.log(tree.getSelectionModel());
console.log(tree.getRenderTo());
console.log(tree.getRootNode());

私は読むことができます

j {myaction: "stSearchAction.do?action=product_tree", myrender: "tree-div", title: "Product selection", width: 300, height: 270…} tree421.js:117
A {events: Object, views: Array[0], modes: Object, selectionMode: "SINGLE", selected: A…} tree421.js:118
undefined tree421.js:119
null tree421.js:120

2 番目のログは、何が書き込まれるかを確認するための単なるテストですが、あまり気にしません。tree.getRenderTo() が未定義であることがわかりますが、getter と setter が生成されるように構成ブロックに配置し、コンストラクターの console.log(this.myrender) が何か良いことを書いたので、私はしません何が起こっているのかを理解してください。最後になりましたが、私の tree.getRootNode() は null です...

ExtJS をよく理解している方からアドバイスをいただければ幸いです。json url の使用方法に問題があるように感じますが、その理由がわかりません。それとも、それは何か他のものかもしれません...

お時間をいただきありがとうございます。

ポニー

4

1 に答える 1