Grid editing issue with template columns

14 posts, 0 answers
  1. Manoj Kapoor
    Manoj Kapoor avatar
    16 posts
    Member since:
    Dec 2011

    Posted 05 Mar 2012 Link to this post

    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
  2. Rosen
    Admin
    Rosen avatar
    3237 posts

    Posted 05 Mar 2012 Link to this post

    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
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  3. Kendo UI is VS 2017 Ready
  4. Manoj Kapoor
    Manoj Kapoor avatar
    16 posts
    Member since:
    Dec 2011

    Posted 05 Mar 2012 Link to this post

    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
  5. Rosen
    Admin
    Rosen avatar
    3237 posts

    Posted 06 Mar 2012 Link to this post

    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
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  6. Oscar
    Oscar avatar
    173 posts
    Member since:
    Oct 2010

    Posted 06 Mar 2012 Link to this post

    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.
  7. Rosen
    Admin
    Rosen avatar
    3237 posts

    Posted 07 Mar 2012 Link to this post

    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
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  8. Oscar
    Oscar avatar
    173 posts
    Member since:
    Oct 2010

    Posted 07 Mar 2012 Link to this post

    Hello Rosen,
    Would you please add this functionallity in your fiddle sample?
    Kind regards,
    Oscar.
  9. Rosen
    Admin
    Rosen avatar
    3237 posts

    Posted 08 Mar 2012 Link to this post

    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
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  10. Oscar
    Oscar avatar
    173 posts
    Member since:
    Oct 2010

    Posted 08 Mar 2012 Link to this post

    Hello Rosen,
    Thank you very much for your help.
    Kind regards,
    Oscar.
  11. Kakasaheb
    Kakasaheb avatar
    2 posts
    Member since:
    Mar 2012

    Posted 15 Mar 2012 Link to this post

    Hello Rosen,
    It was very helpful, thanks alot.
  12. James
    James avatar
    1 posts
    Member since:
    Apr 2012

    Posted 11 Apr 2012 Link to this post

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

    James
  13. Alex Rogers
    Alex Rogers avatar
    13 posts
    Member since:
    Jun 2006

    Posted 20 Jun 2012 Link to this post

    Extremely helpful.  Thanks
  14. Vesselin Obreshkov
    Vesselin Obreshkov avatar
    81 posts
    Member since:
    Jan 2010

    Posted 13 Dec 2012 Link to this post

    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... 
  15. Marcin Butlak
    Marcin Butlak avatar
    26 posts
    Member since:
    Dec 2012

    Posted 14 Dec 2012 Link to this post

    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.
Back to Top
Kendo UI is VS 2017 Ready