I attempted to disable the combo box component with the disabled attribute however it's not working. The code is below:
xtype: 'bkl.exchange.ExchangeRFCombo',
disabled: true,
fieldLabel: 'Exchange',
id: 'exchMapee',
valueField: 'omsMappingCode',
editable: false
The mode is remote and not local. So the values displayed by the combo box is from the database. Is there a solution to this problem?
Your help is kindly appreciated.
Thank You.
You can add this to the combo box:
listeners: {
'afterRender': function () {
this.disable();
}
}
That will disable the box after being rendered.
Related
I need to customize the yes no combo within a specific panel, local to the panel without affecting the parent yesnocombo box configuration. Is there a way to do this?
I am referring to the form I posted earlier in another thread in the Sencha forums, but no one has answered. The url is:
http://www.sencha.com/forum/showthre...ng-Sencha-form
I tried this:
var myNewStore =[
"", "Yes", "Revoke"];
Ext.define('YesNoCombo',{
extend:'Ext.form.ComboBox',
store:myNewStore,
value:'',
emptyText:'Select...',
labelalign:'left',
labelWidth:550,
inputWidth:80,
allowBlank:true,
listeners:{
select:function(comp,record,index){
if(comp.getVelue() == "" || comp.getVale() ===" ")
comp.setValue(null);
}
}
});
but this broke the format of the form.
Is there a way to create a local combo with custom variables like this:
var UserForm_BlahBlahBlah=Ext.create('YesNoCombo', {
name:"UserForm_BlahBlahBlah",
fieldLabel:"BlahBlahBlah",
values:" Yes" "Revoke",
});
I tried this but it will not work. But you get the idea- It is just creating a local extension within a specific panel with new values.
Is this possible? Or is there a better way that sencha implements customizing the combo box with out affecting the parent class?
Regards,
umbre gachoong
You can easily extend Ext.form.ComboBox class and create your own combo box class. Then you can use your combobox in forms.
In the exmaple I create custom combobox by using its xtype which I defined by alias: 'widget.yesNoCombo'. You can also create instance of custom combobox by var combo = Ext.create('YesNoCombo');
Ext.define('YesNoCombo',{
alias: 'widget.yesNoCombo',
extend:'Ext.form.ComboBox',
store: ["No", "Yes", "Revoke"],
emptyText:'Select...',
allowBlank:true
});
Ext.create('Ext.form.Panel', {
renderTo: Ext.getBody(),
items:[
{
xtype: 'yesNoCombo',
fieldLabel:'Yes No Label',
name: 'combo',
},
{
xtype: 'textfield',
fieldLabel: 'Another field',
name: 'anotherField',
},
]
});
See this fiddle https://fiddle.sencha.com/#fiddle/210
I have a number field in my form named cashPay and another field name is totalPayable. Now if cashPay is less then totalPayable I need to alert a message and focus on the cashPay field. But I am not being able to do it. focus method works on textfield in other form but on number field it is not working for me. Can anyone please help me on this. Here is my code below :
in my view page >>>
{
xtype: 'numberfield',
name: 'cashPay',
id: 'cashPay',
keyNavEnabled: false,
mouseWheelEnabled: false,
enableKeyEvents: true,
allowBlank: false,
hideTrigger: true,
fieldLabel: 'Cash Pay',
action: 'cashCalculation'
}
in my controller >>>
Ext.Msg.alert("Warning !","Sorry Cash Pay is less than this month's installment. Please pay the right amount")
Ext.getCmp('cashPay').focus(false, 1);
The focus method is defined by and inherited from Ext.component. So, if it works for textfield, it should also work for numberfield. It may be something else. You may try to delay a little bit more using
numberfield.focus(undefined, 20);
Btw: I don't think you should use Ext.getCmp if your numberfield is within a Ext JS form. If you can, use up and down methods to get from your component that is firing the event to your numberfield.
Use 'show' and a callback:
Ext.Msg.show({
title: 'Warning !',
msg: "Sorry Cash Pay is less than this month's installment. Please pay the right amount",
width: 300,
buttons: Ext.Msg.OK,
closable: false,
fn: justAnotherFunc
});
justAnotherFunc: function() {
Ext.getCmp('cashPay').focus(false, 1);
}
Alert is asynchronous, so the field gets the focus and automatically loses it when you close the alert message.
Alhough it sounds as it doesn't make any sense, it does if I get it to work...
What I'm trying to do is get the combo to do nothing, nothing at all... so I managed to stop it from adding the record to the selected records list. But I can't find the way to stop it from painting the item blue.
The best way to understand what I'm trying to do is check the live preview in the ExtJS Docs page, and see how if you select an item in the dropdown list it goes blue although it doesn't add it to the selectedRecords list.
Here is the url to the ExtJS Docs page...
http://docs.sencha.com/ext-js/4-0/#!/api/Ext.form.field.ComboBox
For those of you not familiar with the tool, just look for the Code Editor there, paste this code and click Live Preview.
// The data store containing the list of states
var states = Ext.create('Ext.data.Store', {
fields: ['abbr', 'name'],
data : [
{"abbr":"AL", "name":"Alabama"},
{"abbr":"AK", "name":"Alaska"},
{"abbr":"AZ", "name":"Arizona"}
]
});
// Create the combo box, attached to the states data store
Ext.create('Ext.form.ComboBox', {
fieldLabel: 'Choose State',
store: states,
queryMode: 'local',
displayField: 'name',
valueField: 'abbr',
multiSelect:true,
renderTo: Ext.getBody(),
onListSelectionChange:function(){
console.log('Do nothing');
}
});
Is this what you are looking for?
onListSelectionChange:function(){
this.picker.getSelectionModel().deselectAll();
}
See it working here: http://jsfiddle.net/lontivero/5Ftrf/1/
Update
If you want to keep the previously selected items as they are, you could try with this. It will prevent only new selections.
onListSelectionChange:function(){
var lastSelected = this.picker.getSelectionModel().lastSelected;
itemNode = this.picker.getNode(lastSelected || 0);
if (itemNode) {
this.picker.getSelectionModel().deselect(lastSelected );
}
}
in jsfiddle: http://jsfiddle.net/lontivero/5Ftrf/2/
I got grid with columns:
...
columns: [
{
xtype: 'rownumberer'
}, {
xtype: 'checkcolumn',
sortable: false,
header: 'done',
dataIndex: 'status',
flex: 2,
width: 55,
callback: function(success, model) {
this.setRawValue(success); // DOESNT WORK
this.setValue(success); // DOESNT WORK
},
}
...
I would like to change checkbox state to checked or unchecked. Functions setValue() or setRawValue() have no effect for the checkbox - moreover - there are not available for
the widget.
Is there simple function like setChecked(boolean) in extjs for checkcolumn?
It is ridiculous I have instance 'checkcolumn' but I can't find basic function.
I will be glad for any hint. Thank you.
Bogus
for record in grid store with 'fieldName' checkcolumn write
record.set('fieldName',false)
or
record.set('fieldName',true)
it make field selected/deselected
the most simple way is to do it in the store , you can add a new boolean field in the store with default of true to do that , and later just change that boolean in the store and the grid will be reflected with the changes
Can someone tell me how to get rid of the feature that filters combo box items.
when i click on the trigger of the combo, i want to display ALL menu items regardless of what text is already in the box, NOT filtered. I've tried several different config options with no luck.
make sense ?
for example, if i have 'View' as my text in the combo, and i click on the trigger, it will only show 'View1' and 'View2' items, i want it to include all the others...
Thanks!
heres my current config
{
...
items: [{
xtype: 'combo',
id: 'myViewsCombo',
emptyText: 'Select View',
selectOnFocus: true,
listeners: {
select: function(combo, record, index) {
L3.handlers.loadView(combo.value);
}},
store: ['View1', 'View2','blahblah']
}]
}
Setting triggerAction: "all" solved the same problem for me.
Try the setting the 'disableKeyFilter' config option to true.
See the ext combobox api.