on listGrid header click call my function()

[mverma]

i am having a listGrid, i want that whenever some one clicks on the header i can capture that event , i.e if a click is done on header of any column i dont want to sort the field rather i want to call my own function.

I tried to override the "sort()" method, but could not do that.

What can be done ?

[mverma]

Plz update,
even if i can get column name in the sort method then it will do.

[Isomorphic]

As stated in the documentation (here), ListGrid headers are instances of Toolbar. So you can override the toolbar's itemClick() function in your listGrid's headerProperties.

[mverma]

how can we override a method within headerProperties, plz provide some example

[Isomorphic]

Well, OK - but this is basic Javascript really.

isc.ListGrid.create({
    ID: "whatever",
    fields: [ { name: "test" } ],
    headerProperties: {
        itemClick: function(item, itemNo) {
            isc.say("Hello world");
        }
    }
});

[mverma]

Thanks,

so if i want that for all columns other than 0th the data shud be sorted then
i need to override sort.
I've written following which does not work, and i m unable to figure out the issue.

headerProperties: {
        itemClick: function(item, itemNo) {
			if(itemNo == 0){
            this.unselectAll();
			}else{
			this.Super('sort',[itemNo,'ascending']);
			}
        }
    }

i don't want to provide any sort order , just want the default functionality to be called for other columns.


Thanks in advance
mverma

[Isomorphic]

Whenever you override a SmartClient function but want to access the overridden logic (perhaps, as in this case, only in certain conditions), call super with name of the method you're overriding:

this.Super("itemClick", arguments);

[mverma]

Thanks, now i m able to call desired function on click of first column .But still clicking on other columns does not sort the list
Below is the code:

isc.ListGrid.create({
    ID: "searchBuildList",
    width:"100%",
	height:"73%",
	alternateRecordStyles:true,
	dataSource: instrument,
	border:"1px solid #183C6B",
	autoDraw:true,
	canEdit:true,
	margin:0,
	booleanTrueImage:"/LiquidBridge/images/checked.png",
	booleanFalseImage:"/LiquidBridge/images/unchecked.png",

	fields:[
		{name:"chk", canToggle:true, width:"50", showTitle: false, type: "boolean", canEdit: true},
        {name:"source", title:"Source",canEdit:false, width:"30%"},
        {name:"attribute", title:"Attribute",canEdit:false, width:"30%"},
        {name:"instrument", title:"Instrument",canEdit:false, width:"35%"}
    ],
	dataProperties:{fetchMode:"basic"},
	leaveScrollbarGap: false,
	showFilterEditor: true,
	saveByCell:true,
	modalEditing: true,
	selectionType: "multiple",
	unselectAll : function(){
		var updateRec;
		var totRec = this.getTotalRows();
		for(var i = 0;i<totRec ; i++){
			updateRec = this.getRecord(i);
			 if(updateRec.chk == true){
				updateRec.chk = false;
				this.updateData(updateRec);
			 }
		}
	},
	headerProperties: {
        itemClick: function(item, itemNo) {
			if(itemNo == 0){
        		searchBuildList.unselectAll();
			}else{
			this.Super("itemClick", arguments);
			}
        }
    },
    editEvent: "click"


})

[mverma]

an alternative solution solved my problem

headerProperties: {
        itemClick: function(item, itemNo) {//alert('in item');
		
		  if(sortDirection == "ascending"){
			  sortDirection="descending";
			}else if(sortDirection == "descending"){
			  sortDirection="ascending";
			}
		
			if(itemNo == 0){
				searchBuildList.unselectAll();
			}else{
				searchBuildList.sort(itemNo,sortDirection);
			}
		 }
    },

taking sortDirection as a global variable