PDA

View Full Version : cursor in non editable ComboBox



andycramb
17 Aug 2009, 2:51 AM
I have a comboBox set up as an editor in a grid as follows:



var combo = new Ext.form.ComboBox({
hiddenName: 'content_group_id',
store: ['satisfied','disatisfied'],
listClass: 'x-combo-list-small',
forceSelection: true,
triggerAction: 'all',
editable:false
})
I am trying to allow a user to only select the options but on click of the combox box it shows the cursor to the right of the text of the first option.

To me it indicates to the user that the box is looking for keyboard input.

I could see no config option to prevent the cursor from appearing.
Is there a way to stop the cursor appearing within the comboBox?

Condor
17 Aug 2009, 4:01 AM
I don't think this is possible. The text is a HTML <input> element, which always shows a cursor when it has the focus.

saJoshua
17 Aug 2009, 4:06 AM
maybe you can try custom styling a Ext.Button with a Menu to look like a drop down list?

Condor
17 Aug 2009, 4:08 AM
Yes, replacing the <input> with an <a> or <button> would work, but would also require a complete rewrite of ComboBox.

andycramb
17 Aug 2009, 4:56 AM
Thanks gentlemen

Interestingly enough I dont have the cursor in IE6 but do have it in FF although it does not blink in FF

johnathanhebert
27 Aug 2010, 10:13 AM
I had the same problem and just added a listener for the focus event in the handler of the render event to blur the dom element when the combo component focus event is raised... like this:



combobox.addListener('render', function(combo) {
combo.el.addListener('focus', function(event, htmlElement, options) {
try {
htmlElement.blur();
} catch (ex) {
}
});
});