Extjs Ext.ComboBox 自动调整现有内容 [英] Extjs Ext.ComboBox autosize over existing content
问题描述
在现有 html select 项上应用 Ext.ComboBox 时遇到问题，即使现有内容使 html 选择大约 20px(通过它的内容非静态宽度设置)，Ext.ComboBox 将调整为一种默认的大宽度值.有没有一种方法可以根据现有项目自动调整 Ext.ComboBox 的大小而不使用默认宽度?
I have a problem when apply an Ext.ComboBox over an existing html select item, even if the existing content makes the html select about 20px (by it's content non static width is set), the Ext.ComboBox will resize to a sort of default, large, width value. There's a way to auto resize the Ext.ComboBox based on the existing items and no using the default width?
即使我知道Ext是哪个最好的工具，这个问题也会让我的同事放弃Extjs.
Even if I know which best tool Ext is, this issue will let my colleagues to discard Extjs.
提前致谢
推荐答案
从技术上讲，您无法制作组合自动宽度"——Ext 实际上将 转换为常规 在幕后， 元素必须指定宽度/大小.但是，您可以欺骗 Ext 根据现有的 调整组合的大小，这应该会给您相同的最终结果.这是来自 Ext 组合演示页面的一个例子，我有修改了 width 配置值:
You can't technically make a combo "auto width" -- Ext actually converts the <select> into a regular <input> behind the scenes, and <input> elements have to have a width/size specified. However, you can trick Ext into sizing the combo based on the existing <select> which should give you the same end result. Here's an example from the Ext combo demo page, where I have modified the width config value:
var converted = new Ext.form.ComboBox({
typeAhead: true,
triggerAction: 'all',
transform:'state',
width: Ext.fly('state').getWidth(),
forceSelection:true
});
明显的警告是，如果您随后在呈现列表后修改列表，组合将不会自动调整自身大小，您必须自己想办法调整其大小.
The obvious caveat would be that if you subsequently modify the list after it's rendered, the combo will not resize itself automatically and you'd have to figure out a way to resize it yourself.
这篇关于Extjs Ext.ComboBox 自动调整现有内容的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
