Get column headers of tree panel in extjs - extjs4.1

Can anyone let me know how to get the columns header name of tree panel (which were set dynamically) on click of any row in that particular column.
I tried:
handler: function(treepanel, rowIndex, colIndex) {
treepanel.getColumnModel().getColumnAt(colIndex));
}
Any help would be greatly appreciated.

Try:
treepanel.getView().getGridColumns()[colIndex]['name'];

Related

Titanium: click on element(View, Label e.t.c.) should increase its top by 1

I've binded the same function to all elements that I want(let's say View and Label).
In this onClick handler function I want to get the element which was clicked and increase its 'top' by 1.
Please tell me if you know how to do that, I can't find an answer yet.
My global click handler function:
function increaseElementTop(e) {
// Here we should increase element's top position.
Ti.API.info(JSON.stringify(e));
}
Thanks, any help is appreciated.
Get the e.source attribute from the Event e. Then use the setTop() method.
if (e.source == $.yourLabel) {
$.yourLabel.setTop($.yourLabel.getTop() + 1)
}
UPDATE: Regarding your comment: I thought it would only be used for two elements. A universal approach would be something like this:
e.source.setTop(e.source.getTop() + 1);
Unfortunately I have no machine available to test the code but I will do so later (Tuesday I guess). Just try it and let your programm print the e.source variable. If this does not work you can also try to use e.source.getId().
function increaseElementTop(e) {
var theUIElement = e.source;
theUIElement.top = theUIElement.top + 1;
}
Add the event listener to each of your UIElements, and this will get the element you click on & modify the top.

How do I get the parent row index from a grid cell in Extjs?

I have a CheckColumn in a GridPanel and I want to disable the editable cells of a given row if the checkbox on that row has been checked. Is this possible?
The easiest way to do this is to listen to the beforeedit event on the editor. Something like:
cellEditing.on('beforeedit', function(ed, context) {
return !context.record.get('checkField');
});

Sencha Touch custom back button

I need to create a custom back button for a nestedlist. In my controller I have created a listener to capture the button tap event as follows:
onCustomButtonBackTap: function(button, e, options) {
this.getMyList().setDepth(node.data.depth-1); <-- seudo code, does not work
},
My question is how can I set the current level of my nestedlist back by one each time the custom button is clicked? Also, if this approach is not correct, please let me know
Thanks is advance for your help and advice
First you need to get the current active item to set the new one... you need to use the methods in my sample code below to accomplish what you are looking for:
var newIndex = this.getMyList().getActiveItem();
this.getMyList().setActiveItem(newIndex-1);
#Jeff, thank you for your answer but I found the following method which works better in my circumstance
onCustomButtonBackTap: function(button, e, options) {
if (this.getMyList().items.indexOf(this.getMyList().getActiveItem()) > 0) {
this.getMyList().onBackTap();
}
},

Dojo EnhancedGrid and programmatic selection

Here's my problem: in my application I have a Dojo EnhancedGrid, backed up by an ItemFileReadStore. The page flow looks like this:
The user selects a value from a selection list.
The item from the list is posted on a server and then the grid is updated with data from the server (don't ask why, this is how it's supposed to work)
The new item is highlighted in the grid.
Now, the first two steps work like a charm; however, the third step gave me some headaches. After the data is successfully POSTed to the server (via dojo.xhrPost() ) the following code runs:
myGrid.store.close();
myGrid._refresh();
myGrid.store.fetch({
onComplete : function(items) {
for ( var i = 0; i < items.length; i++) {
if (items[i].documentType[0].id == documentTypeId) {
var newItemIndex = myGrid.getItemIndex(items[i]);
exportMappingGrid.selection.deselectAll();
exportMappingGrid.selection.addToSelection(newItemIndex);
}
}
}
});
Now, the selection of the grid is updated (i.e. the selection object has a selectedIndex > 0), but visually there's no response, unless I hover the mouse over the "selected" row. If I remove the .deselectAll() line (which I suspected as the culprit) then I sometimes end up with two items selected at once, although the grid selectionMode attribute is set to single.
Any thoughts on this one?
Thanks a lot.
You need to use setSelected(), like so
exportMappingGrid.selection.setSelected(newItemIndex, true);
The second parameter is true to select the row, false to unselect it.
This is what works for me:
grid.selection.clear();
grid.selection.addToSelection(newItemIndex);
grid.selection.getFirstSelected();
Jon

Nested List toolbar

I am creating a nested list and setting the BackText on item tap using "setBackText()". That works fine.
But at the same time, I want the title of the toolbar to be set as well.
The code:
onItemTap : function(nestedList, list, index, node, record, e) {
var partsOfStr = record.get('text').split(';');
val = partsOfStr[2];
currDocument = val;
Ext.getCmp('nestedList').setTitle('HII');
Ext.getCmp('nestedList').setBackText(currDocument);
},
does not seem to be working for me.
Any suggestions?
Thanks in advance.
updateTitleText is by default set to true for nestedlist, so if you are using a data store to set the data for your nestedlist, your title will always be set according to which category of data you are selecting.
So, set
updateTitleText: false
and then try to set the title dynamically like this,
Ext.getCmp('nestedList').setTitle('HII');