ExtJS＆IE7：シンプルウィンドウでのレンダリングの問題

この非常にシンプルなウィンドウ拡張を作成しました。 Firefoxでは、それは必要なように見えますが、IE7では、含まれている項目がウィンドウから流れ出します。ExtJS＆IE7：シンプルウィンドウでのレンダリングの問題

Wrong rendering in IE

私はこれを修正するために何ができますか？

コード：（文書型は厳しいですが、いくつかの理由で表示されません）

<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> 
    <title>Online example</title> 
    <link rel="stylesheet" type="text/css" href="http://dev.sencha.com/deploy/dev/resources/css/ext-all.css" /> 

    <script type="text/javascript" src="http://dev.sencha.com/deploy/dev/adapter/ext/ext-base.js"></script>  

    <script type="text/javascript" src="http://dev.sencha.com/deploy/dev/ext-all.js"></script>  

</head> 
<body> 

<script type="text/javascript"> 

Ext.onReady(function(){ 

    MyWindow = Ext.extend(Ext.Window, { 
     layout: 'fit', 
     width: 370, 
     height: 500, 
     resizable: true, 
     closable: true, 
     closeAction: 'hide', 
     collapsible: true, 
     autoScroll: true, 
     bodyStyle: 'padding:5px;', 
     title: 'Window', 

     initComponent: function() { 

      var config = { 
       items: 
       [ 
        { 
         xtype: 'fieldset', 
         title: 'Buffer valg', 
         layout: 'form', 
         items: 
         [ 
          { 
           xtype: 'numberfield',                          
           fieldLabel: 'Label'          
          }, { 
           xtype: 'checkbox', 
           fieldLabel: 'Label', 
           checked: true          
          } 
         ] 
        } 
       ] 
      } 

      Ext.apply(this, Ext.apply(this.initialConfig, config)); 

      // Config object has already been applied to 'this' so properties can 
      // be overriden here or new properties (e.g. items, tools, buttons) 
      // can be added, eg: 

      // Call parent (required) 
      MyWindow.superclass.initComponent.apply(this, arguments); 
     } 
    }); 

    AWindow = new MyWindow(); 
    AWindow.show(); 
}); 

</script> 

</body> 
</html>

出典

2011-02-07 Chau

すべてのオーバーフローのために何らかの理由はありますか？これなら、私に教えてください

Ext.onReady(function(){ 

MyWindow = Ext.extend(Ext.Window, { 
    resizable: true, 
    closable: true, 
    width: 400, 
    closeAction: 'hide', 
    collapsible: true, 
    bodyStyle: 'padding:5px;', 
    title: 'Window', 

    initComponent: function() { 

     var config = { 
      items: 
      [ 
       { 
        xtype: 'fieldset', 
        title: 'Buffer valg', 
        layout: 'form', 
        items: 
        [ 
         { 
          xtype: 'numberfield',                          
          fieldLabel: 'Label'          
         }, { 
          xtype: 'checkbox', 
          fieldLabel: 'Label', 
          checked: true          
         } 
        ] 
       } 
      ] 
     } 

     Ext.apply(this, Ext.apply(this.initialConfig, config)); 

     // Config object has already been applied to 'this' so properties can 
     // be overriden here or new properties (e.g. items, tools, buttons) 
     // can be added, eg: 

     // Call parent (required) 
     MyWindow.superclass.initComponent.apply(this, arguments); 
    } 
}); 

AWindow = new MyWindow(); 
AWindow.show();

を：私はExt.Windowは本当に私見スクロールバーを持つべきではない、意味それはスクロールバーを削除するので、私はあなたのコードを変更し、それはまた、IEで要素オーバーフローのバグを削除する必要がありますそうではありません...

出典

2011-02-10 19:34:03 JamesHalsall

これは動作していないようです。しかし、問題を回す：ウィンドウと内容を作成して、複数の 'fieldset'アイテムがすべて複数のアイテムを含む' container'を持つようにするにはどうしたらいいですか？（なぜ私はウィンドウをスクロールすることができないのですか？） – Chau

なぜあなたはそれが小さすぎることを保証したいですか？ユーザビリティの観点から、スクロールバーは厄介です。 'bodyStyle： 'オーバーフローを追加することはできますが、視覚的な問題を解決したい場合は：hidden'' – JamesHalsall

私は、ここでは主に問題があると思いますが（autoScroll: trueの使用）、他の欠陥も指摘しなければなりません。

なぜinitialConfigに書き込みますか？

initComponent: function() { 
    var config = { 
     ... 
    }; 
    Ext.apply(this, Ext.apply(this.initialConfig, config));

initialConfigには、コンポーネントのコンストラクタに渡されるconfigのみが含まれている必要があります。また、コンポーネントのクローン作成時に使用されます。ドキュメントでさえ、読み取り専用です。あなたが100％確実でないなら、それをしないでください。それに、なぜあなたがそれをやりたいのか分からない。あなたのコンポーネントは、initComponentを書くときにうまく動作します：

initComponent: function() { 
    // you can set all the config options directly to this. 
    this.items = [ 
     ... 
    ]; 
    MyWindow.superclass.initComponent.call(this); 
}

出典

2011-02-10 20:21:01

私はどこかで拾った古いうさぎです：$私は自分の道を変えるでしょう - ） – Chau

ExtJS＆IE7：シンプルウィンドウでのレンダリングの問題

答えて

関連する問題