Tagfield光標未到達當前行

-1

我正在使用tagfield，並且在選擇兩個或三個值之後，我的光標向下移動。我希望我的光標位於同一行，即使有一點空間存在，並且在輸入或選擇任何值之後，它就會向下移動。任何人都可以幫助我如何得到這個。我也指定了具體的寬度。Tagfield光標未到達當前行

我的代碼：

{ xtype: Tagfield, 
    growMax : 10, 
    valueField: 'title', 
    displayField: 'title', 
    parentGrid : me, 
    queryMode: 'local', 
    autoLoadOnValue:true, 
    multiSelect: true, 
    isFilterDataLoaded: false, 
    disabled: true, 
    triggers: { 
     clear: { 
      weight: -30, 
      cls: 'button-cross', 
      handler: function(){ 
       this.clearValue(); 
      } 
     } 
    }, 
}

這裏是我的小提琴手：TagfieldFiddle。步驟重現： 1.選擇三個標籤。 2.對於第四個標籤光標將進入下一行。我希望cursoer應該在第一線。

來源

2017-05-25 David

downvote的一個具體原因。。 – David

-1

您必須根據輸入的文本調整輸入欄的大小。由於輸入字段爲Ext.dom.Element，你必須檢查，這適用於所有的瀏覽器：

listeners:{ 
    afterrender: function(tagfield) { 
     var minWidth = 10, // modify here for adjustable text field width 
      el = Ext.getBody().createChild(), 
      measurer = new Ext.util.TextMetrics(el); 
     tagfield.inputEl.setWidth(minWidth); 
     tagfield.inputEl.on('keyup', function() { 
      var requiredWidth = measurer.getWidth(tagfield.inputEl.dom.value); 
      tagfield.inputEl.setWidth(requiredWidth+minWidth); 
     }); 
     tagfield.on('change', function() { 
      var requiredWidth = measurer.getWidth(tagfield.inputEl.dom.value); 
      tagfield.inputEl.setWidth(requiredWidth+minWidth); 
     }); 
    } 
}

這裏試試：https://fiddle.sencha.com/#view/editor&fiddle/20cb

我已經改變了ExtJS的版本，因爲那裏似乎是一個錯誤ExtJS 6.0中的標記字段 - 如果通過鍵盤輸入，則選擇後不會刪除輸入內容。

來源

2017-05-25 10:40:00 Alexander

這個答案太棒了，但我無法調整我的標記字段，因爲我將它用作網格列的小部件，所以我給出了'growMax：10'。那麼我會盡量修改我可以。謝謝 – David

當我按照我的要求修改你的答案時，我得到了同樣的答案，https://fiddle.sencha.com/#view/editor&fiddle/20cf – David

我的答案不是調整標記字段的大小，而是調整輸入元素。這是他的差異。 – Alexander

Tagfield光標未到達當前行

回答

相關問題