We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on : Nov 16th 2018).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Displaying CheckBox for special values

Thread ID:

Created:

Updated:

Platform:

Replies:

127061 Oct 24,2016 09:54 AM UTC Oct 26,2016 03:53 AM UTC ASP.NET MVC 5
loading
Tags: Grid
Anthony Leblanc
Asked On October 24, 2016 09:54 AM UTC

Hi,

I have a column with a "bool-like" value.
Indeed, my column have "X" value for true and null for false. Can I display this value as checkbox ?

Regards,

Leblanc Anthony

Juan Acosta
Replied On October 25, 2016 04:31 AM UTC

Hi Anthony, 

Check this. 

It is also possible to add specific images or icons for the columns using x-template parameters. 

Regards, 

J

Anthony Leblanc
Replied On October 25, 2016 07:58 AM UTC

Hi Juan,

I misspoke, I meant that ma datasource return a "X" string for true and a null object for false.
So need I make a template with a little script that create the checkbox according the datasource Value and how can I do that ?

Regards,

Anthony Leblanc

Seeni Sakthi Kumar Seeni Raj [Syncfusion]
Replied On October 25, 2016 10:10 AM UTC

Hi Anthony, 

Query #1: my column have "X" value for true and null for false. Can I display this value as checkbox 

Using a Template Column and TemplateRefresh event of the Grid, we can render the X/null as a checkbox. Refer to the following code example and Help Document. 

<script type="text/x-jsrender" id="checkTemplate"> 
    <input type="checkbox"> 
</script> 
 
@(Html.EJ().Grid<object>("Grid") 
        .Datasource((IEnumerable<object>)ViewBag.datasource) 
            .AllowPaging() 
            .Columns(col => 
        { 
            col.HeaderText("Verified").Template("#checkTemplate").Add(); 
               .. .  
        }) 
        .ClientSideEvents(events => events.TemplateRefresh("refresh")) 
) 
 
<script> 
    function refresh(args) { 
        if ($(args.cell).find("input").length) { 
            var val = !ej.isNullOrUndefined(args.data.Verified); 
            $(args.cell).find("input").ejCheckBox({ checked: val }); 
        } 
    } 
</script> 

Note: Here Verified is one of the columns in the dataSource holds X/null values. 


Query #2: add specific images or icons for the columns using x-template parameters 

Even we can use the template column to bind the images/icons. Refer to the following code example and image. 

<script type="text/x-jsrender" id="imageTemp"> 
    <img src="/Content/ej/Employees/{{:EmployeeID}}.png" /> 
</script> 
 
<script type="text/x-jsrender" id="icon"> 
    <img src="/Content/ej/web/common-images/ribbon/Check.png" /> 
</script> 
 
@(Html.EJ().Grid<object>("Grid") 
        .Datasource((IEnumerable<object>)ViewBag.datasource) 
            .AllowPaging() 
            .Columns(col => 
        { 
            col.HeaderText("Employee Image").Template("#imageTemp").Add(); 
            col.HeaderText("Employee icon").Template("#icon").Add(); 
               .. .  
        }) 
) 


 

Using a column Template, we have an online demo. http://mvc.syncfusion.com/demos/web/grid/columntemplate 

Regards, 
Seeni Sakthi Kumar S. 


Anthony Leblanc
Replied On October 25, 2016 11:43 AM UTC

Hi,

Thanks for this. It's work perfectly :)

Best Regards,

Leblanc Anthony

Seeni Sakthi Kumar Seeni Raj [Syncfusion]
Replied On October 26, 2016 03:53 AM UTC

Hi Leblanc, 

Thanks for the update. We are happy to hear that your requirement has been achieved. Please get back to us, if you require further assistance on this. 

Regards, 
Seeni Sakthi Kumar S. 


CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

;