PDA

View Full Version : Grid with column editor as combo, select a value and click on save btn IE9 issue



ranjay
22 Jan 2016, 9:56 AM
I have a issue with Extjs 4.2 when I am trying to run below code in Internet Explorer 9, it needs to 2 click after selecting a different Value in combo editor and clicking on ok btn, to get saved, where as chrome it needs one click on ok btn after change, listener get invoked and data get saved.
Ideally it should take one click on ok btn, to save value, I tried several options like fire a select listener on column and call focus on Ok btn, so it should save in one click, but didn't worked.
Do you have any suggestion, or idea, please do let me know.I may have done wrong, same code works fine in Internet Explorer 9 if build through Ext js 5.1.

Ext.define('Teamworks.view.complete.InstanceGrid', { extend: 'Ext.window.Window',
requires: ['Ext.grid.*',
'Ext.data.*',
'Ext.form.field.ComboBox',
'Ext.Panel',
'Ext.toolbar.Spacer',
'Ext.toolbar.Fill'
],
alias: 'widget.instancegrid',
border: false,
width:485,
height: 315,
title: 'Confirm Due Date',
bodyBorder: false,
items: [{
xtype: 'grid',
width: 470,
height: 285,
store: 'abcStore',
selModel: 'cellmodel',
plugins: {
ptype: 'cellediting',
clicksToEdit: 1
},
border: false,
columnLines: true,
columns: [
{
text : 'Participant',
width : 120,
align :'center',
sortable : false,
dataIndex: 'PARTICIPANT'
},
{
text : 'Topic',
flex : 1,
align :'center',
sortable : true,
dataIndex: 'TOPICS_LIST'
},
{
text : 'Due Date',
width : 70,
dataIndex: 'DUE_DURATION',
editor: {
xtype: 'combobox',
forceSelection: true,
editable: false,
triggerAction: 'all',
allowBlank: false,
valueField:'VALUE',
displayField:'NAME',
matchFieldWidth: true,
listConfig : {
width: 50
},
store:'defStore'
}
}],
dockedItems: [{
xtype: 'toolbar',
dock: 'bottom',
items: [{
xtype:'tbfill'
},{
text: 'OK',
listeners: {
click: function(btn){
console.log('Value saved in DB');
//Ajax Call to save the data if combo box value
}
}
}]
}]

}]
});

Gary Schlosberg
22 Jan 2016, 10:51 AM
I couldn't find any existing issue matching that description. Are you able to recreate this issue in a runnable test case so we might see what's happening?
https://fiddle.sencha.com/#home

ranjay
29 Jan 2016, 10:42 AM
I couldn't find any existing issue matching that description. Are you able to recreate this issue in a runnable test case so we might see what's happening?
https://fiddle.sencha.com/#home


Gary, sorry for delayed response. I was busy with other stuff. I never worked with fiddle. so took some time. I created a sample. take a look.
https://fiddle.sencha.com/#fiddle/14pp

This is IE browser issue, same code works fine as expected in chrome.I reproduced this issue in IE-9 with frame work Ext JS 4.2.1.883 Classic, which is the last 4.x version.
Steps: in first row Due Date column, select a combo and change value to 1 and then click mouse on ok button at bottom, you can't see the alert message. once again if you click on the Ok button, then only you can see the alert message.In place of alert message you can use, rest call or what ever.
If any question let me know.

Gary Schlosberg
29 Jan 2016, 12:54 PM
I see the issue now. Fortunately, this problem was fixed in 4.2.3.

ranjay
8 Feb 2016, 1:11 PM
Gary, I updated to Extjs 4.2.5(which has changes of 4.2.3) and it works. But, could you please tell me in which class this issue has been fixed. As, when I updated to 4.2.5 some xtype is not working like' itemselector', so, want to to put changes of the fix in my ux folder and will refer that.Thanks for advance for the help.
Ranjay

Gary Schlosberg
8 Feb 2016, 2:21 PM
I searched for the ticket which led to this fix (to see what files where updated) but unfortunately I was unable to locate it. It's possible that it was fixed as part of another repair.