I'm working on an "old" application in ExtJS 2.2 and the method expand of Ext.form.ComboBox doesn't work in my case.
I just do
Ext.getCmp('adresse_field_ville').expand();
But nothing happends, even not a trace in console.
I'm sure to use the good object, because juste before I do
Ext.getCmp('adresse_field_ville').setValue('');
And it works.
By googling I found the method onTriggerClick. This method expands the combo and focuses it but i need to keep the focus on an other field.
Thanks
Try focus do the expanding, add focus event in the listener
listeners: {
focus: function(fld) {
this.onTriggerClick();
}
}
Execute the focus event:
Ext.getCmp('adresse_field_ville').focus(false,100);
Related
The following form is nearly completely editable without mouse:
https://fiddle.sencha.com/#view/editor&fiddle/2gsi
The only thing that is not accessible is the trigger of the textareafield.
Since the textareafield is typeable, I would like to make the trigger of the textareafield tabbable. Tab is the only thing I think I can use without hindering general ability to type.
How can I do this? I have not found anything in the trigger documentation
Not quite a complete answer, but too long to be a comment, and it might be helpful to you. Here is one possible solution: https://fiddle.sencha.com/#view/editor&fiddle/2gt8
I have overridden the trigger's renderTpl config by making the top level element a button (by default it is a div), and I've added some styling to it.
You can make the div tabable with tabindex, but the issue will be that when you press enter on the focused trigger, it will not execute the handler.
With the current approach, the single issue is that the textarea's focused styling gets messed up. When you press press tab after being focused on the trigger, the textarea will still keep the focused class.
You could set a keyboard shortcut for it, like that:
xtype: 'textareafield',
fieldLabel: 'Name',
enableKeyEvents: true, //important
listeners: {
keydown: function (a,e){
if ((e.altKey)&&(e.keyCode==73)){ //in that case Alt+i , but you could use any other combination
a.getTriggers().book.el.dom.click();
}
}
}
Hope that helps
This is related to ExtJs 4.2 Charts.
I am stuck where i need to make selection of multiple columns in a column chart only when a user press ctrl key + column selection with mouse click. So, i couldn't find how to capture control key press event in itemclick event of chart.
Please send in your suggestions...
This is a shot at a direction you might take and not a definitive answer.
You might look at adding a couple listeners to the Panel or Viewport you are working with, add a keydown event and the keyup event, not sure if that will work, you might go so far as to add it to the DOM models window too. You see the problem I am seeing here is that you have to have focus first on something, and you will probably at least have the focus of the window, where if you, put this listener on the actual chart you have to focus there by clicking on the chart first and then selecting the key and then clicking again, kind of a lot of actions I would think and not intuitive.
Then set a global variable to true on the key press down and back to false on the key press up.
Then in the itemmousedown event that you also create on the charts Series so you can read the variable and use it as you intend.
here is what the listener should look like
series: [{
type: 'column',
...
listeners: {
itemmousedown: function(item, eOpts) {
.... // get your global variable here.
console.log(item);
console.log(eOpts);
}
},
I found a solution it is working fine but its a kind of workaround.
Here is the code snippet...
var bIsControlkeyPressed=false;
function setCtrlKey(event){
if (event.ctrlKey) {
bIsControlkeyPressed=true;
}else{
bIsControlkeyPressed=false;
}
alert(bIsControlkeyPressed)
}
<body onmousedown = "setCtrlKey(event)">hello</body>
When you click anywhere on page (body part i.e. 'hello' in this case), this code will set the global flag to true if ctrl key is also pressed else false is set. I know there are other ways this can be done but this approach works with IE8 also :)
I am using Extjs4.2.2.
For a radiogroup I have a change listener in controller. I am changing radio selection several times progmatically but I don't want change events to fire in some cases. So I used suspendEvents before changing the selection as follows:
radio.suspendEvents();
//radio.suspendEvent('change');
radio.setValue({communication: 1}); // where communications is the name of radios
However this did not help and a change event is still fired.
How to stop that.
The suspendEvent event bug is there for comboboxes too. Here are the bug reports:
http://www.sencha.com/forum/showthread.php?171525-suspendEvents-did-not-affect-to-Ext.app.Controller.control
http://www.sencha.com/forum/showthread.php?232919-ComboBox-suspendEvents-doesn-t-work
I found a solution that fixes it for comboboxes. Maybe the solution works for radios too. It works in Ext JS 4.2.1. Maybe other versions too.
radio.suspendCheckChange++;
radio.setValue({communication: 1});
radio.suspendCheckChange--;
Team,
I am having one problem where I donot want to expand combo box on certain flag and want to display the alert message.
there is no event like onClick in EXTJS so I tried with focus event but still combo box is expanding.
code
focus:function() {
if(this.store.baseParams.donotExpandFlag) {
alert("I should not expand this combo");
// What to do here and out side of IF block so that there is conditional expansion
}
}
You need to specifiy your ExtJS version and please format your code.
Here is what you can do for ExtJS4.x
Manually set/unset the isExpanded property. That should work (untested)
for ExtJS3.x you will have to override the the isExpanded() method and in additon apply a custom flag which indicates blocked/auto and get checked before the default code gets executed.
You may try this (untested)
_isExpanded: true, // true means block, false auto
isExpanded: function(){
return this._isExpanded || (this.list && this.list.isVisible());
},
No, this works. See the JSFiddle for ExtJS3.4
Second JSFiddle for ExtJS3.4 with a form
my grid allowing to select multiple row selection that is once i click on cell and press shift+arrow down button it allows me to select next set of records i wanted to disable this functionality how it can be done,on grid level how to catch keypress events and return false once shift+arrow down button is pressed
For ExtJS 3.x add this to the grid properties:
selModel: new Ext.grid.rowSelectionModel({singleSelect:true})
Grids behave as you want by default. Make sure you have NOT set multiSelect or simpleSelect to true.
Firstly, it's hard to understand your question without any punctuation. Secondly, without any code example, it's even harder to understand a question without any punctuations.
Here's my guess answer of your question:
editorgridpanel.on('keypress', function (e) {
if (e.shiftKey === true && e.getKey() === e.DOWN) {
e.stopEvent(); //this will stop the shift+down keypress event from proceeding.
}
});
The accepted answer seems to be a bit out of date. For version ExtJS4.x use this solution :
selModel: new Ext.selection.Model({mode: 'SINGLE'})
Or just use this :
selModel: {mode: 'SINGLE'}