Wie man am besten eine Liste von Artikeln als Popup anzeigt, die in ExtJS korrekt skaliert wird 6

Question

Ich habe eine Liste von Fehlern (zwischen 1 und 20 in der Liste). Ich möchte ein Popup-Fenster erstellen, das die Liste anzeigt und so groß ist, dass es unabhängig von der Schriftart oder dem Browser des Benutzers relativ gut darin enthalten ist. Ich habe hier in Senchas Geige ein Beispiel gegeben, das mein Problem und meine nicht optimale Lösung zeigt. Bitte schlagen Sie vor, wie man verbessert (oder einen anderen Mechanismus in Sencha verwendet, um zu bekommen, was ich will).

https://fiddle.sencha.com/#fiddle/18ef

Ext.application({ 
    name: 'Fiddle', 

    launch: function() { 

     var errorTpl = new Ext.XTemplate('<tpl for=".">', '<ul class="thumb-wrap">', '<li><b>{Message}</b></li>', '</ul>', '</tpl>'); 

     var errorView = Ext.create('Ext.view.View', { 
      layout: 'fit', 
      // data: errorList, 
      data: [{ 
       Message: '1 alsfdjaslfkjas;fljksafjsakflsalfjsalf;safsa;lfsal;dfsalfd' 
      }, { 
       Message: '2 alsfdjaslfkjas;fljksafjsakflsalfjsalf;safsa;lfsal;dfsalfd' 
      }, { 
       Message: '3 alsfdjaslfkjas;fljksafjsakflsalfjsalf;safsa;lfsal;dfsalfd' 
      }, { 
       Message: '4 alsfdjaslfkjas;fljksafjsakflsalfjsalf;safsa;lfsal;dfsalfd' 
      }, { 
       Message: '5 alsfdjaslfkjas;fljksafjsakflsalfjsalf;safsa;lfsal;dfsalfd' 
      }, { 
       Message: '6 alsfdjaslfkjas;fljksafjsakflsalfjsalf;safsa;lfsal;dfsalfd' 
      }, { 
       Message: '7 alsfdjasl alsfdjasl alsfdjasl fkjas;fljksafjsakflsalfjsalf;safsa;lfsal;dfsalfd' 
      }], 
      tpl: errorTpl, 
      itemSelector: 'div.thumb-wrap' 
     }); 

     var win = Ext.create('Ext.window.Window', { 
      title: 'Problems Found (Please Correct)', 
      modal: true, 
      layout: 'vbox', 
      width: 500, 
      height: 50 + errorView.data.length * 40, 
      items: [{ 
       xtype: 'button', 
       margin: "10 10 10 10", 
       text: 'close', 
       listeners: { 
        click: function() { 
         this.up('window').close(); 
        } 
       } 
      }, 
      errorView] 
     }).show(); 
    } 
}); 

*** UPDATE: tat ich dies und es scheint eine Menge

var htmlError = errorTpl.apply(errorList); 
Ext.Msg.alert('Problems Found (Please Correct)',htmlError); 

Answer 1

Nur nicht festgelegt, die Höhe des Fensters zu helfen.

Arbeitsbeispiel: https://fiddle.sencha.com/#fiddle/18ej