Can not set SfCheckBox in Grid Template

[Mike Chafin]

I use the same Grid dialog template for both Update and Add. When updating the <SfCheckBox> works just fine but when using it to add it does not.

                        <GridEditSettings Dialog=@DialogParams ShowDeleteConfirmDialog="true" AllowAdding="true" AllowEditOnDblClick="true" AllowEditing="true" AllowDeleting="true" Mode="@EditMode.Dialog">

                            <HeaderTemplate>

                                @{

                                    <span>@HeaderTitle</span>

                                }

                            </HeaderTemplate>

                            <FooterTemplate>

                                <SfButton CssClass="btn btn-primary" OnClick=@(() => Save(context as UserDto)) IsPrimary="true">@ButtonTitle</SfButton>

                                <SfButton OnClick="Cancel">Cancel</SfButton>

                            </FooterTemplate>

                            <Template>

                                @{

                                    var user = (context as UserDto);

                                    if (user.UserId != null)

                                    {

                                        UserRoles = SetUserRoles(user);

                                    }

                                    else

                                    {

                                        UserRoles = new RoleModelDto();

                                    }

                                    <div class="form-row">

                                        <div class="form-group col-md-6">

                                            <SfTextBox ID="username" @[email protected] Enabled="true" Placeholder="User Name" FloatLabelType="FloatLabelType.Auto" />

                                        </div>

                                        <div class="form-group col-md-6">

                                            <SfTextBox ID="password" @[email protected] Enabled="true" Placeholder="Password" FloatLabelType="FloatLabelType.Auto" />

                                        </div>

                                    </div>

                                    <div class="form-row">

                                        <div class="form-group col-md-6">

                                            <SfTextBox ID="firstname" @[email protected] Enabled="true" Placeholder="First Name" FloatLabelType="FloatLabelType.Auto" />

                                        </div>

                                        <div class="form-group col-md-6">

                                            <SfTextBox ID="lastname" @[email protected] Enabled="true" Placeholder="Last Name" FloatLabelType="FloatLabelType.Auto" />

                                        </div>

                                    </div>

                                    <div class="form-row">

                                        <div class="form-group col-md-6">

                                            <SfMaskedTextBox ID="phone" Mask="[phone]" @[email protected] Enabled="true" Placeholder="Phone Number" FloatLabelType="FloatLabelType.Auto" />

                                        </div>

                                        <div class="form-group col-md-6">

                                            <SfTextBox ID="email" @[email protected] Enabled="true" Placeholder="Email" FloatLabelType="FloatLabelType.Auto" />

                                        </div>

                                    </div>

                                    <div class="form-row">

                                        <div class="form-group col-md-4">

                                            <SfCheckBox @[email protected] Label="Text Notification" LabelPosition="LabelPosition.After" />

                                        </div>

                                        <div class="form-group col-md-4">

                                            <SfCheckBox @[email protected] Label="Email Notification" LabelPosition="LabelPosition.After" />

                                        </div>

                                        <div class="form-group col-md-4">

                                            <SfCheckBox @[email protected] Label="Two Factor" LabelPosition="LabelPosition.After" />

                                        </div>

                                    </div>

                                    <p>Roles</p>

                                    <div class="form-row">

                                        <div class="form-group col-md-4">

                                            <SfCheckBox Name="IsAdmin" ID="isadmin" @[email protected] Label="Administrator" LabelPosition="LabelPosition.After" />

                                        </div>

                                        <div class="form-group col-md-4">

                                            <SfCheckBox Name="IsCareAdmin" ID="iscareadmin" @[email protected] Label="Care Admin" LabelPosition="LabelPosition.After" />

                                        </div>

                                        <div class="form-group col-md-4">

                                            <SfCheckBox @[email protected] Label="Care Giver" LabelPosition="LabelPosition.After" />

                                        </div>

                                    </div>

                                    <div class="form-row">

                                        <div class="form-group col-md-4">

                                            <SfCheckBox @[email protected] Label="Reports" LabelPosition="LabelPosition.After" />

                                        </div>

                                        <div class="form-group col-md-4">

                                            <SfCheckBox @[email protected] Label="Office Staff" LabelPosition="LabelPosition.After" />

                                        </div>

                                        <div class="form-group col-md-4">

                                            <SfCheckBox @[email protected] Label="Clergy" LabelPosition="LabelPosition.After" />

                                        </div>

                                    </div>

                                }

                            </Template>

                        </GridEditSettings>

The beside working in the update and not add the first three checkbox work just fine in both modes.

I've attached a short video.

Attachment: SfCheckBox_eb3945a4.rar

[Gayathri KarunaiAnandam]

Hi Mike,  

We tried reproducing the reported problem by creating a sample based on the shared codes, but we could not face the reported problem from our side. We are attaching the sample for your reference, please download the sample from the link below,  

Sample : https://www.syncfusion.com/downloads/support/directtrac/general/ze/ServerApp-1199391952  

  

Kindly refer the above sample, and if you are still facing difficulties then the following details would be helpful for us to proceed further.  

·        Share with us a simple issue reproducing sample. This would be helpful for us to validate the problem based on your scenario. 

·        Or if possible, reproduce the problem with the above attached sample and share with us for further analysis. 

·        Share the details of any exception or script error occurred in the browser console when try checking the checkbox. 

·        Share the complete Grid rendering codes and model class codes. 

·        Share the SetUserRoles and RoleModelDto codes. 

·        Share the exact scenario in which you are facing this reported problem. 

The provided information will help us analyze the problem and provide you a solution as early as possible.  

Regards,  

Gayathri K 

[Mike Chafin]

After playing with it for a while I found that if I include the RolesModelDto class in the same project as the Grid it worked. Using the Chrome debugger I found that it just was not setting the class .e-checked on the <span>  Never saw or found an error.

I finally, just included the RoleModelDto as a base class. and it works.

[Gayathri KarunaiAnandam]

Hi Mike, 

 

Thanks for the update. 

 

We are happy to hear that your requirement has been fulfilled. Please feel free to contact us if you need any further assistance on this. 

 

Regards, 

Gayathri K