1

私はEXTJで働いています。以下の例を確認してください。

var containerForm=Ext.widget('panel',{ 
        width: 1100,
        border: false,
        frame: true,
        "layout":"fit",
        title: 'Add User',
        hidden:true,
        listeners:{
                'afterrender': function(panelObj,eOpts )
                {
                    panelObj.doLayout();
                }
        }
    });

上記のパネルのHTMLは、次のコードに示すようにajax応答を介して更新されています。

formObj.update(jsonResp.html,true,function(){
    containerForm.doLayout();containerForm.focus();
});

containerFormは自動高さパネルです。このパネルは複数の目的に使用されるため、

このパネルコンテンツに「formObj.update」を入力すると、コンテンツは正しく読み込まれますが、

ajax応答「jsonResp.html」に画像がある場合、そのときdoLayout（）関数はパネルの高さを適切に調整するのに役立ちません。

2か所にdoLayout関数を追加しましたが、上記の場合、コールバック関数は役に立ちません。

2秒後にdoLayout関数を呼び出すと、正しく機能するだけです。

formObj.update(jsonResp.html,true,function(){
    setTimeout('containerForm.doLayout(); containerForm.focus();', 2000);
});

doLayout関数を使用するための適切なリスナーはどれですか？

4

1 に答える 1

1

Mutation Eventsを見ることはできますが、これらはクロス ブラウザ互換ではありません。もしそうなら、あなたは試すことができます： formObj.on('DOMSubtreeModified', function(){containerForm.doLayout();}, this);

あなたは本当にあなたformObj.update()が完全であることを確認する必要があります. それが、タイムアウトが役立つ理由です。innerHtml が設定されていることを確認したい場合は、自分で確認してください。

Ext.dom.Element.update()のソースを見るとdom.innerHtml、html を更新するために使用されているだけです。update コールバックでは、呼び出す前に innerHtml が存在するかどうかを確認できますdoLayout()。簡単なコード例を簡単にまとめました。

var doLayoutIfComplete = function(){
  if(document.getElementById('formObjId').innerHTML == jsonResp.html){
    containerForm.doLayout();
  }
  else{
    doLayoutWhenComplete.delay(500); //Check again in 500ms
  }
}

var doLayoutWhenComplete = new Ext.util.DelayedTask(function(){
  doLayoutIfComplete();     
});

formObj.update(jsonResp.html,true,function(){ 
  doLayoutWhenComplete.delay(500);
});
于 2013-03-06T17:34:02.663 に答える