This is a migrated thread and some comments may be shown as answers.

Formating boolean

4 Answers 578 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Dennis
Top achievements
Rank 1
Dennis asked on 20 Aug 2012, 12:53 AM
Hi I've got a grid and one of the columns is bound ta boolean value. I would like to format it to something else other than true and false (On / Off for instance), and i realize I don't know how to do that. With a format field inside the columns property? How would such a format look like? Thanks in advance!

4 Answers, 1 is accepted

Sort by
0
Alexander Valchev
Telerik team
answered on 23 Aug 2012, 05:47 AM
Hi Dennis,

To achieve that you can use a column template and JavaScript Conditional operator. As an example:
columns: [
    {field: "foo", template: "#= foo ? 'yes' : 'no' #"}
]


Kind regards,
Alexander Valchev
the Telerik team
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Dennis
Top achievements
Rank 1
answered on 23 Aug 2012, 11:20 AM
Never even thought of templates, and their the natural solution here. Thanks, you helped me out a lot!
0
Dennis
Top achievements
Rank 1
answered on 23 Aug 2012, 11:48 AM
Hey, i tried this out but when i put a template inside my columns property the whole table just gets messed up and starts looking like the picture in the attachment.
  
this is the code for my grid, I'm using declarative binding. It's start looking like this once I turn on a template, I've tried putting anything in it. I even turned off all the other CSS and left only the kendo ones, because i thought that something there was messing it up but it's the same.

<div id = "TeamMembersGird" data-role="grid" data-sortable="true" data-pagable="true" data-editable='{"mode" : "popup", "confirmation" : "Are you sure you want to delete this team member?"}'
     data-bind="source: teamMembersSource"
     data-columns='[{"field":"FirstName", "title":"First name"},
                    {"field":"LastName", "title":"Last name"},
                    {"field":"IsCompanyAdmin",  template: "#= IsCompanyAdmin ? 'Yes' : 'No' #", "title":"Admin"},
                    {"title":"Action","width":"300px",
                     "command":["edit", "destroy", {"text" : "Reset password", "click": "ResetPassword" }]}]'>
</div>
0
Iliana Nikolova
Telerik team
answered on 28 Aug 2012, 08:06 AM
Hi Dennis,

The reason to get this appearance for the grid when using template is due to the quotation marks - you should escape them. I believe the following definition of the template should help to resolve the issue: 
<div id = "TeamMembersGird" .... data-columns='[... {"field":"IsCompanyAdmin", "template": "#= IsCompanyAdmin ? \"Yes\" : \"No\" #"}]'>

As a general information, please note that the template should be in quotes:
<div id = "TeamMembersGird" .... data-columns='[... {"field":"...", "template": "...}]'>
 

Regards,
Iliana Nikolova
the Telerik team
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Tags
Grid
Asked by
Dennis
Top achievements
Rank 1
Answers by
Alexander Valchev
Telerik team
Dennis
Top achievements
Rank 1
Iliana Nikolova
Telerik team
Share this question
or