Wie Zellen cellediting breiter als die tatsächliche Spalte machen?

Sehr einfaches Szenario: Ich möchte ein kleines Raster für einen guten Überblick haben. Aber wenn man in eine Zelle klickt, sollte der Editor eine höhere Breite als die tatsächliche Spalte haben.Wie Zellen cellediting breiter als die tatsächliche Spalte machen?

Beispiel: https://fiddle.sencha.com/#fiddle/reg&view/editor

Ich habe versucht, die Breite zu geben, und ich versuchte es in der afterrender hinzuzufügen. Die Breite ist immer genau so breit wie die Spalte. Dasselbe Problem mit Textareas.

editor: { 
    xtype: 'textfield', 
    enableKeyEvents: true, 
    selectOnFocus: true, 
    width: 500, 
    listeners: { 
     afterrender: function (field) { 
      field.setWidth(500); 
     } 
    } 
}

Ich dachte, das sollte einfach sein, aber ich konnte keinen Weg finden, das zu erreichen. Ich kann die Höhe in einem Textfeld angeben, aber die Breite wird nicht berücksichtigt.

Quelle

2017-09-25 gulty

Hey können Sie bitte genau sagen, wie Spalte nach Editor aussehen ist displayed.Please einige Bilder posten. – Tejas

Wenn Sie in die Firmenzelle klicken, erwarte ich, dass das Textfeld der Editoren größer wird. Es würde die Preisspalte rechts überlappen, damit ich mehr Text eingeben kann. Jetzt ist die companys Spalte mit Breite: 160. Ich möchte, dass die Textfeld-Editor-Zelle zum Beispiel 240 ist. – gulty

Ich habe dieses Problem gelöst, außer zum ersten Mal, da das Textfeld anfänglich nicht gerendert wird. Nachdem es gerendert ist, habe ich seine Breite in beforedit event.Wenn Sie eine Lösung wollen, kann ich hier einfügen. – Tejas

Überprüfen Sie unten Geige. https://fiddle.sencha.com/#fiddle/27bv&view/editor Hier habe ich die Einstellung für die Breite des Tabellenknotens vorgenommen, in dem der Zelleneditor von Ext.get(Ext.get(Ext.query('div.x-grid-editor')[0]).dom.childNodes[0]).setWidth(300) gerendert wird.

Dieser Ansatz hat eine Einschränkung - zum ersten Mal wird die Breite nicht gesetzt, wie im beforedit-Ereignis erhalten wir keine Instanz von Editor.Wenn wir diese Instanz bekommen, können wir ähnliche Logik für die Breite des Editors anwenden. überprüfen Sie bitte, ob es Ihr Problem lösen konnte oder nicht. Lassen Sie mich auch für irgendwelche Änderungen wissen. Hinweis: Ich habe impl. diese Sache nur für die erste Spalte.

Quelle

2017-09-26 13:00:13 Tejas

Danke für den Rat - es half mir herauszufinden, wie es funktionieren wird. Ich benutze meine Nachrender-Methode - ich hatte gerade das falsche Element, um damit zu arbeiten. Anstatt "Feld" zu verwenden, muss ich das genaue dom-Element bekommen. Ext.get (field.el.dom.childNodes [1]). SetWidth (500) - Index ist 1 Ursache 0 ist die Bezeichnung .. – gulty

Noch einfacher: field.bodyEl.setWidth (500); im Inneren des Nachreiters .. oh und BTW. Dies funktioniert nur für Textfelder. Ich werde eine Antwort hinzufügen, wenn ich die komplette Lösung für einfache Textfelder auch herausgefunden habe, aber es sollte keine große Sache sein. – gulty

Okay, ich habe eine Lösung gefunden, die mir ziemlich nahe kommt.

afterrender: function (field) { 
    field.bodyEl.setWidth(500); 
}

Dies funktioniert für Textfelder und Textfelder mit Ext Version 5. ich, dass auch in meiner Geige heraus, dass ich die falsche Ext-Version verwendet. Scheint nicht 4. mit Ext zu arbeiten

https://fiddle.sencha.com/#fiddle/27cc&view/editor

Quelle

2017-09-26 14:57:48 gulty

Unsere beiden Lösungen ergeben zusammen ein komplettes Ergebnis. – Tejas

Wie Zellen cellediting breiter als die tatsächliche Spalte machen?

Antwort

Verwandte Themen