PDA

View Full Version : [FIXED-757] Read Only Ext.ux.form.MultiSelect



dtex-lab
19 Mar 2010, 11:16 PM
Ext version tested:

Ext 3.1.2
Adapter used:

ext
Extension used:

ux-all.js
css used:

only default ext-all.css
Browser versions tested against:

Chrome 4
IE8
FF 3.6
Safari 4
Operating System:

WinXP Pro
Description:

It is not possibile to have a read only multiselect (Ext.ux.form.MultiSelect)
Test Case:


function buildSimpleStore(aLimit) {
var vStore = new Array();
for (var i = 0; i < aLimit; i++) {
var vOption = new Array();
vOption.push("" + i);
vOption.push("Element " + i);
vStore.push(vOption);
}
return vStore;
}
Ext.onReady(function () {
var vAvailableStore = buildSimpleStore(5);
var vViewport = new Ext.Viewport({
layout: 'border',
items: [{
id: 'myform',
xtype: 'form',
title: 'Test ItemSelector',
region: 'center',
autoHeight: true,
layout: 'form',
items: [{
xtype: 'multiselect',
fieldLabel: 'Readonly MultiSelect',
id: "mymulti",
name: "mymulti",
//disabled : true,
delimiter: ';',
value: "2",
readOnly: true,
store: vAvailableStore,
hideTrigger: true
}],
buttons: [{
text: 'Submit',
handler: function () {
Ext.getCmp('myform').getForm().submit({
url: 'TestItemSelector.html'
});
}
}]
}]
});
})

See this URL : http://www.extjs.com/forum/showthread.php?t=94715


Steps to reproduce the problem:

Run the test case. In the Multiselect, user can change selected value and so when they are submitted, they are changed
bar
The result that was expected:

user should be not able to change selected values
The result that occurs instead:

User can change values


Debugging already done:

readOnly property is not managed
Possible fix:

a quick fix is to consider the readOnly property in the onViewBeforeClick (get a look to the code below)
maybe a more complete solution should be "move" selected value on top and/or don't display unselected values. Maybe this behaviour should be enable by properties
Warning: of couse when the multiselect field is submitted, original untouchable values must be submitted (if the field is not disabled)


onViewBeforeClick: function (vw, index, node, e) {
if (this.disabled || this.readOnly) {
returnfalse;
}
}