Enable/Disable editing for ListGrid field on change

[pordeep]

Currently I'm trying to enable or disable a ListGrid field Editable based on change event of a combo item. I've written a code to disable the column initially. I want to enable the field based on the continent selection. If it if Asia it should be disabled and for other continent it should be disabled. I've written a change event for the continent field. But not sure how to make contryName field editable or non-editable. Please let me know how to implement this.

Thanks in advance.

isc.ListGrid.create({
    ID: "countryList",
    width:550, height:224, alternateRecordStyles:true, showAllRecords:true, cellHeight:22,
    // use server-side dataSource so edits are retained across page transitions
    dataSource: countryDS,
    // display a subset of fields from the datasource
    fields:[
        {name:"countryCode", title:"Flag", width:40, type:"image", imageURLPrefix:"flags/16/", imageURLSuffix:".png", canEdit:false},
        {name:"countryName"},
        {name:"continent", change:"alert ('Set countryName editable here')"},
        {name:"member_g8"},
        {name:"population", formatCellValue:"isc.Format.toUSString(value);"},
        {name:"independence"}
    ],
    autoFetchData: true,
    canEdit: true,
    canEditCell : function (rowNum, colNum) {
            var canEdit = this.Super("canEditCell", arguments);
      // do your custom processing and return a custom value
      var record = null;
      record = this.getRecord(rowNum);
      if (record != null) {
             if ((colNum == 1) && (record.continent == "Asia") )
                              return false;
      }
       // otherwise return the returnValue of the superclass implementation
            return canEdit;
      },

    editEvent: "click"
})

[Isomorphic]

Hi Pordeep
The easiest way to do this would be to use cell-by-cell editing (via the editByCell attribute). This way you will not need to add a change handler to update the editability of the first column on the fly - insted the 'canEditCell' method will be run whenever the user attempts to edit the first column, and will only show an editor for that field if appropriate.

A couple of related notes - you can edit by cell, but still save by row, via the saveByCell attribute.
You probably want to make the following changes to your canEditCell implementation:
- columns can be reordered, so rather than checking for colNum == 1, you probbly want to look at the result of this.getFieldName(colNum).
- using getEditedRecord() to retrieve the current value of the 'continent' field for the row is probably more appropriate than looking at the underlying record. This ensures that if the edit value for that field has been set, but not yet saved, the edited value is picked up rather than the value currently stored on the server.

Let us know if the editByCell approach won't work for you.
Thanks

Isomorphic Software

[manishit]

canEditCell is firing for each row

In continuation of this..
I am also using same code.. but it seems canEditCell is getting fired for each row everytime when we click on any cell.
In addition on this , i am adding a new record with startEditNew and at that time , canEditCell is firing 2 times for the same record.
WHich is causing flickering of my screen.
What shd i do to avoid this?

[Isomorphic]

Hello manishit,

canEditCell() must fire once per cell or you would not be able to control editability on a cell by cell basis. Just make sure your canEditCell() method is fast. If you need help optimizing it, show the code you have now.

[manishit]

canEditCell is firing for each row

so whenver i click on any cell.. it will fire each cell of every row???
here is my code

myCanEditCell:function(rowNum,colNum,dhuTab,resultList)
{ if (resultList.getEditedRecord(rowNum).curRemove==2)
return false;
if ( colNum==3 && ( resultList.getEditedRecord(rowNum).duCode!='****')) return false;
if ( colNum==3) return true;
if (resultList.getEditedRecord(rowNum).status=='I' && resultList.getEditedRecord(rowNum).isNew!='Y' )
{

if ( (resultList.getFieldName(colNum)=='beginDt') || (resultList.getFieldName(colNum)=='endDt') ) return true ; else return false;
}
if (resultList.getEditedRecord(rowNum).status=='A' && resultList.getEditedRecord(rowNum).isNew!='Y' )
if ( resultList.getFieldName(colNum)=='endDt') return true ; else return false;

if (resultList.getEditedRecord(rowNum).isNew=='Y')
{

if ( (resultList.getFieldName(colNum)=='beginDt') || (resultList.getFieldName(colNum)=='endDt') ) return true ;
}
if (resultList.getEditedRecord(rowNum).isNew!='Y')
{
if ( (resultList.getFieldName(colNum)=='beginDt') || (resultList.getFieldName(colNum)=='endDt') ) return true ;
}

return false;

},

[Isomorphic]

Yes, it fires that often. Think about it. How else can you dynamically control cell by cell editability?

About your code - don't call getEditedRecord() 8 times and don't call getFieldName() 7 times :) Just call each once and use a local variable.

If you are optimizing for IE6, don't allocate 'endDt', 'Y', 'beginDt' multiple times. Again make a local variable.

If you need to get yet faster (you probably don't), use getRecord() instead of getEditedRecord() if you are only checking fields that the user cannot edit, and all the cases that do not require calls to getEditedRecord() first.

[manishit]

still have same problem with editCell screen

I changed code according to ur suggestion.. but no change.. any other suggestion.. I can't change getRecord as its new Record added with startNew().

So it seems more data in grid.. more till it will take.
Why its getting fired for each row everytime.. it shd fire only for that row for which click event happend.

Please suggest something.

//alert(rowNum+' , '+colNum+" , "+resultList.getFieldName(colNum) +" , "+resultList.getEditedRecord(rowNum).isNew +" , "+resultList.getEditedRecord(rowNum).status);
var rowNum1 = resultList.getEditedRecord(rowNum);
var fieldName1 = resultList.getFieldName(colNum);
var status =rowNum1.status;
var isNew = rowNum1.isNew;
var duCode = rowNum1.duCode;
if (rowNum1.curRemove==2)
return false;
if ( colNum==3 && ( duCode!='****')) return false;
if ( colNum==3) return true;
if (status=='I' && isNew!='Y' )
{
if ( (fieldName1=='beginDt') || (fieldName1=='endDt') ) return true ; else return false;
}
if (status=='A' && isNew!='Y' )
if ( fieldName1=='endDt') return true ; else return false;
if (isNew=='Y')
{
if ( (fieldName1=='beginDt') || (fieldName1=='endDt') ) return true ;
}
else if (isNew!='Y')
{
if ( (fieldName1=='beginDt') || (fieldName1=='endDt') ) return true ;
}

return false;