Grid editing issue with template columns

[Manoj Kapoor]

Hi There,

I have used a Kendo Grid with its cell editing feature enabled. I am able to successfully bind the grid using the data source & cell edit for non-template columns too works fine.

The attache zip file contains the code for the used .aspx page & also the snapshots of the error I have.

Snapshot 1 shows my Kendo Grid where first 2 columns are Template Columns (Check box & Hyperlink)
Editing on non-template columns is illustrated in Snapshot 2
While editing template columns, on cell click it moves into editable mode, but the text associated to the hyperlink disappears.  Refer Snapshot 3 for details

Could you provide your valuable inputs for?

• Editing Template Column
• Adding a Select/Deselect all checkbox on the header row for the template column containing check boxes

Thanks & Regards,
Manoj Kapoor

[Rosen]

Hi,

You should set the template column's field option to point to a field which is marked as editable false:

dataSource: {
    schema: {
        model: {
            id: 'Id',
            fields: {
                select: {
                    editable: false
                },
                FirstName: {
                    editable: false
                },
                /*..*/
            }
        }
    }
}

/*....*/
columns: [{
    field: "select",
    template: '#= kendo.toString("<input type=\'checkbox\' id=\'select\' />") #'
},
{
    template: '<a href="javascript:OpenCRUD(\'Abcd.aspx?Id=#=Id#\')">#=FirstName#</a>',
    field: "FirstName"
},
/*..*/
]

All the best,
Rosen
the Telerik team

[Manoj Kapoor]

Hi Rosen,

Thanks for the promot reply on the posted queries.

As per the requirements, I need to have even the template field editable. On cell click it would display the hyperlink text & on lost focus shall retain the link but change the displayed text. So setting editable: false would not help me meeting the requirements.

And what about the other requrement that I have mentioned i.e. "Adding a Select/Deselect all checkbox on the header row for the template column containing check boxes" would not help me meeting the requirements.

Thanks & Regards,
Manoj Kapoor

[Rosen]

Hello,

If you leave the field editable option to true and keep the field setting on the column, the default editor will be shown when cell is clicked.

The header checkbox is not supported out-of-the-box. Therefore, you should use custom javascript to handle this. For example:

Regards,
Rosen
the Telerik team

[Oscar]

Hello Rosen,
If you change the paseSize to 5 and then check some checkboxes of the first page, when you go to page 2 and come back to 1,  the checked checkboxes of the first page are shown unchecked. How can I keep getting these values?

Regards,
Oscar.

[Rosen]

Hello Oscar,

In the described scenario you should manually persist the selected(checked) items. Then  Grid dataBound event can be used to iterate over the rows and restore the selection.

Regards,
Rosen
the Telerik team

[Oscar]

Hello Rosen,
Would you please add this functionallity in your fiddle sample?
Kind regards,
Oscar.

[Rosen]

Hello Oscar,

Although providing custom implementation is outside of the scope of our support, I have modified the jsFiddle to demonstrate a possible implementation:

Greetings,
Rosen
the Telerik team

[Oscar]

Hello Rosen,
Thank you very much for your help.
Kind regards,
Oscar.

[Kakasaheb]

Hello Rosen,
It was very helpful, thanks alot.

[James]

Just copied exact same code on my machine and grid still not persisting the checkbox values. Anyone knows why?

James

[Alex Rogers]

Extremely helpful.  Thanks

[Vesselin Obreshkov]

I have a similar situation, however the proposed solution does not work for my scenario.

I have a grid with several ID columns (OfferID, SomethingID, etc) all of which need to be editable and all of which need to have a template since having a bunch of meaningless numbers showing on the grid is just... meaningless. Needless to say, I'm having the same issue after inserting a new record, all template columns are either empty or have a numeric value. Hitting the refresh button at the bottom of the grid obviously fixes the rendering as it reads and binds itself all over. 

The proposed solution to not define templates for editable items does not work for me. A simple refresh/rebind of the grid after an insert would do the trick (as sub-optimal of a solution as it might be), however, the grid does not have an event that I can hook into after an Update or Insert that I can trigger a grid.dataSource.read() to force the grid to read the data again from the server and re-paint itself. 

Do you guys have any solution for a situation where you need to edit larger objects with lots of ID fields that need to show their corresponding string values (column: FieldID, template: FIeldName, etc) when viewed, however, the actual column needs to be bound to the numeric/ID fields so when you submit a create or update request to the server, it sends the numeric values needed to create/update the object. 

Any help would be greatly appreciated. Even some ugly hack would work at this point as I've all but given up on trying to do CRUD operations inside grids... 

[Marcin Butlak]

Hi Vesselin,
Have you tried to use the scenario showed in the demo http://demos.kendoui.com/web/grid/editing-custom.html. This is an example of using a custom editor but it also shows how to bind the ID with the Value data and display them correctly in the grid.