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. Image for the cookie policy date

Render Boolean value as checkbox

In project i want to render boolean value as checkbox but even though value is true it is not showing checkbox as checked but when we open that in edit mode it is showing in checked checkbox but i am not able to set it to false.
The following is my column directive :-

My response model is line
  1. {
  2. bruUnitNamenull
  3. bruUnits4
  4. name"Weekly"
  5. offerabletrue
  6. price140
  7. rateFactor14 
  8. }

5 Replies

PS Pavithra Subramaniyam Syncfusion Team June 10, 2019 08:51 AM UTC

Hi Sandeep, 
Thanks for contacting Syncfusion support. 
We have tried to reproduce the reported behavior at our end but Boolean column is working fine at our end. Please refer to the below sample link for your reference. 
Could you please provide the below details that will be helpful for us to provide a better solution as early as possible. 
  1. Share the full Grid code.
  2. Share the details how you have bound data to the Grid
  3. Please reproduce the issue in the above sample if possible
Pavithra S. 

LA License Admin June 14, 2019 12:57 PM UTC

Hi Pavithra,


For us if we have only one grid it is working fine but if we have subgrid it is not allowing me to edit it (uncheck it). Can you share example where in subgrid we have rendered boolean as checkbox.

PS Pavithra Subramaniyam Syncfusion Team June 17, 2019 05:34 AM UTC

Hi Sandeep, 
From your query we suspect that you are using boolean column in  hierarchy Grid. We have prepared a simple sample based on your query in which we have rendered a Boolean column in child Grid and enabled editing . Please refer the below code example and sample link for more information. 
export class Hierarchy extends SampleBase { 
    constructor() {  
        this.childGrid = { 
            dataSource: hierarchyOrderdata, 
            queryString: 'EmployeeID', 
            columns: [ 
                { field: 'OrderID', headerText: 'Order ID', isPrimaryKey:true,textAlign: 'Right', width: 120 }, 
                .   .  . 
    render() { 
        return (<div className='control-pane'> 
                <div className='control-section'> 
                    <GridComponent dataSource={employeeData} childGrid={this.childGrid} > 
                          .    .    . 
                        <Inject services={[Edit, DetailRow ,Toolbar, Page]}/> 
render(<Hierarchy />, document.getElementById('sample')); 
If the above does not meet your requirement then share more details like Grid code, simple sample, screenshot or video of the issue which will be more helpful for us to provide a better solution as soon as possible. 
Pavithra S. 

LA License Admin June 27, 2019 10:58 AM UTC

Hi Pavithra,

Can we have call tomorrow at 3:00pm IST to discuss this?

PS Pavithra Subramaniyam Syncfusion Team June 28, 2019 08:50 AM UTC

Hi Sandeep, 
Thanks for contacting Syncfusion support 
We have created a new incident #240441 under your account and updated the meeting invitation there. So please follow the incident for more updated regarding the Grid Boolean column query. 
Pavithra S. 

Live Chat Icon For mobile
Up arrow icon