如何使选择字段中的默认文本像文本字段的占位符一样灰色？

Question

我有以下选择字段的形式：

 { 
      xtype: 'selectfield', 
      name: 'minprice', 
      label: 'Min Price', 
      valueField: 'No min', 
      placeHolder: 'No min', 
      useClearIcon: true, 
      options: [{ 
       text: 'No Min', value: 'Test' 
      }, { 
       text: 'Test2', value: 'Test2' 
      }, { 
       text: 'Test3', value: 'Test3' 
      }]     
     } 

我想第一个选项“不分钟”看起来像一个占位符（所以它的浅灰色）。原因在于表单的其余部分具有浅灰色的占位符，并且具有黑色文本的选择字段不符合表单的样式。我试过指定占位符和valueField没有成功。

谢谢。

Answer 1

您可以使用placeHolder属性，但不应指定options属性。例如：

{ id:'theSelect', 
    name: 'fieldId', 
    xtype: 'selectfield', 
    displayField: 'text', 
    valueField: 'value',  
    placeHolder :'No min' 
} 

再有这样或从商店加载它加载选项：

Ext.getCmp('theSelect').setOptions(
[ {text: 'First Option', value: 'first'}, 
    {text: 'Second Option', value: 'second'}, 
    {text: 'Third Option', value: 'third'} 
]); 

看到这里的整个工作代码http://jsfiddle.net/p5K4q/16/

Answer 2

你可以用-webkit-text-fill-color做到这一点。

到针对特定领域的最简单的方法是这样的：

{ 
    xtype: 'datepickerfield', 
    placeHolder : 'Date', 
    cls: 'your-class' 
} 

.your-class .x-form-field { 
    -webkit-text-fill-color: red; 
} 

Answer 3

可以使用placeholder并设置AutoComplete为false，因为它被设置为默认值是true ..

这对我来说工作得很好。