Grid Displaying text for value not working on grid column

3 posts, 0 answers
  1. Van
    Van avatar
    4 posts
    Member since:
    Feb 2020

    Posted 08 Jul 2020 Link to this post


    I'm working on Kendo Grid with Angular 1.7 with Typescript. So far, displaying dropdown list during edit (popup) mode is working as expected. I'm currently struggling with displaying text instead of bound value on grid column. The model of data source includes 2 properties: "Label" and "Id". I've tried to follow these examples:



    but with no luck. After "Update" button is clicked, the grid shows "Id" instead of "Label".

    Here is my custom editor:

    columnConfig.editor = (container, options) => {
          $('<input required data-text-field="Label" data-value-field="Id" data-bind="value:' + options.field + '" /> ')
                 autoBind: false,
                 dataTextField: "Label",
                 dataValueField: "Id",
                     dataSource: {
                          data: CustomPickListItems


    How can I make the grid display "Label" but save "Id" to local data?

  2. Preslav
    Preslav avatar
    591 posts

    Posted 10 Jul 2020 Link to this post

    Hi Van,

    To modify the column display, I would suggest using the columns.template property -

    For example, check this demo -

    In the demo, the template of the "Category" column looks like:

    template: "#=Category.CategoryName#"

    Progress Telerik

    Progress is here for your business, like always. Read more about the measures we are taking to ensure business continuity and help fight the COVID-19 pandemic.
    Our thoughts here at Progress are with those affected by the outbreak.
  3. Van
    Van avatar
    4 posts
    Member since:
    Feb 2020

    Posted 06 Aug 2020 in reply to Preslav Link to this post

    Thank you! I'm able to get it work by using template.
Back to Top