View Full Version : How to display (for example) < and > characters (&lt; and &gt;) in combobox

4 Apr 2011, 3:01 AM

I have a problem with combo boxes in grids.

I need to let the user choose options that include < and > characters in them, and if I encode them as &lt; and &gt; , it works fine in the drop-down and in the grid cell I was editing. However, the text box (which I disable editing of anyway) shows the selection in its encoded form (&lt; and &gt;) - how can I make the text input also display the actual < and > characters?


var store = new Ext.data.ArrayStore({
data : [
['Ford', 'Focus'],
['BMW', 'M3'],
['Toyota', 'Prius'],
fields : ['manufacturer', 'model']

var grid = new Ext.grid.EditorGridPanel({
title: 'Non-saving Grid',
store: store,
region: 'center',
columns: [
header : 'Manufacturer',
sortable: true,
dataIndex: 'manufacturer',
editor: {
xtype: 'combo',
store: ['BMW', 'Toyota', 'Ford', '&lt;Jaguar&gt;'],
editable: false,
forceSelection: true,
triggerAction: 'all'
header : 'Model',
sortable: true,
dataIndex: 'model'

In this example, when you select 'Jaguar' in the drop down it appears in the text input box as '&lt;Jaguar&gt;' instead of '<Jaguar>' which is what I want to appear. Its appearance in the grid and in the drop down list are fine.


4 Apr 2011, 4:07 AM
Update: in my real code (the above is just a demo explaining my problem without exposing anyone to my real code), I have realised that to make it post back the correct values I need to specify this as the combo box's store:

store: [['BMW', 'BMW'], ['Toyota', 'Toyota'], ['Ford', 'Ford'], ['<Jaguar>', '&lt;Jaguar&gt;']]

6 Apr 2011, 8:37 AM
Nobody has any idea on how to do this?

I'm guessing a ComboBox has 2 components - the dropdown list and the text field. The dropdown list renders the '&lt;' etc. correctly, but for the text field I need some sort of filter that decodes HTML before being displayed in it..... nobody can give me a hint as to where to start looking?

I hope I'm not going to have to create my own ComboBox class... :)