ExtJS - beforeedit on a Ext.grid.Panel not in API - extjs

This is not a problem, but rather a question that came into my mind. Me along with my friend were trying to disable RowEditing when a user doubleclicks a record/cell in the Ext.panel.Grid ( depending on some criteria ). I was looking into the API and was trying a way out. However, in the meanwhile when I googled one of the answers on Stackoverflow ( yeah here ) suggested to use the below event:
grid.on('beforeedit', function(editor, e) {
if (e.colIdx === 0 && e.record.get('status') == 4)
return false;
});
It worked !!! But when I referred back to ExtJS 4.2.0 API ( that's what we are using ), I didn't find the 'beforeedit' event on Ext.grid.Panel or it's parent Ext.panel.Table. The RowEditing plugin had the beforeedit event, but not the Grid. However, the older version 4.1.0 had the event for Ext.panel.Grid ( http://docs.sencha.com/extjs/4.1.0/#!/api/Ext.grid.Panel-event-beforeedit ), in fact beforeedit on Ext.panel.Grid was introduced since 4.1.0.
So, it's just the question which is bothering me that - Was the event deprecated so soon and still working? Or the API for 4.2.0 missed it? Or what was the reason that an event not defined in the API of the version am using, is still working !!! This will help me understand how the API is all documented and if I should rely on older versions for better documentation or whatever.

The beforeedit event is not in the docs for Grid, because it is not an event on the Grid. It is an event on the Grid Editing Plugin.
The events from the Grid Editing Plugin are mixed-in to the grid at run-time, so if you use the Grid Editing Plugin, then the beforeedit event will appear to be on the Grid.
Not sure why they changed the docs between 4.1 and 4.2, but the difference doesn't really matter as the behaviour is the same.

Related

Extjs6: How can I programmactically expand/collapse a row using rowexpander in a grid

I saw some answers for Extjs4, which use 'toggleRow' method:
How to expand row in a grid using rowexpander plugin Extjs 4.1.1
but it is no longer available in extjs6. Please help.
In fact, it is still available, but they removed it from the docs, I don't know why.

Remove highlighting from extjs combobox after selection

Whenever an item is selcted from extjs combobox, it gets highlighted as follows
Is there any way to remove this highlighting. I searched in google with no success.
I am using ExtJs 2.3.0
First of all, you really need to consider upgrading your ExtJS version. I haven't seen this behavior by default in the newer versions.
Looking at the docs, in the config phase i don't see anythin which can help you.
The simplest thing you can do is add a select listener where you call the selectText method
comboBox.on('select', function(combo,record,index) {
// set the cursor at the start
//comboBox.selectText(0,0);
var cursorEnd =combo.getValue().length;
comboBox.selectText(cursorEnd,cursorEnd);
});
See working example with jsfiddle. It uses a newer ExtJS for illustrative purposes, however the select event and selectText method are also available in ExtJS 2.3.

Is there anything about ext js?

I need a project about it ,thank you.I am using Ext.grid.gridpanel.As in rowclick event, we can handle row click of grid..Is there any event to handle column click of grid?
i want to select a particular column of grid.
You are looking for headerclick. Also for any more questions like this just look through the extjs documentation per your version. Sencha documents it very well.

Ext js 4.2.2 - validation support for cellEditing

I am using cellEditing plugin to edit a particular cell in a grid. This serves my requirements really well from the UI point of view.
However, I want to add validations to the cell and prevent user from completing the edit event unless the value entered is valid. I am trying to achieve this through:
editor: {
allowBlank: false,
vtype:'customized vtype'
}
I am also implementing edit & beforeedit callback events. The error message & tooltip are shown correctly but even with an invalid value, you can still press enter and the callback method 'canceledit' is invoked. I do not want the edit event to be completed/canceled unless the value entered is valid.
However, if I use RowEditing plugin, the validation works as expected and edit event is not completed until the value entered is valid. This is what I need but the look and feel of cellEditing instead of RowEditing plugin more closely matches my requirements.
Is there a way I can have similar validation behavior in cellEditing?
I believe you should listen to validateedit editor event and do your stuff there. See validateedit in docs.

Extjs suspendEvent on radio button

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--;

Resources