How to rebind data source to grid with json

[Athiwat]

I have a grid that contains checkbox

<ej:Grid ID="grdPage"

                                    runat='server'

                                    MinWidth="600"

                                    Height="108%"

                                    EnableTheming="true"

                                    IsResponsive="true"

                                    AllowScrolling="false"

                                    AllowSorting="true"

                                    AllowMultiSorting="true"

                                    AllowResizing="true"

                                    AllowPaging="false"

                                    EnableTouch="true"

                                    GridLines="None">

                                    <Columns>

                                        <ej:Column Field="Code" Visible="false"></ej:Column>

                                        <ej:Column Field="MenuCode" Visible="false"></ej:Column>

                                        <ej:Column Field="Name" HeaderText="ชื่อหน้าจอ" Width="150" TextAlign="Left" AllowEditing="false"></ej:Column>

                                        <ej:Column Field="AllowRead" HeaderText="อ่าน" Width="20" TextAlign="Left" displayAsCheckBox="true"  editType="booleanedit"></ej:Column>

                                        <ej:Column Field="AllowInsert" HeaderText="เพิ่ม" Width="20" TextAlign="Left" displayAsCheckBox="true"  editType="booleanedit"></ej:Column>

                                        <ej:Column Field="AllowUpdate" HeaderText="แก้ไข" Width="20" TextAlign="Left" displayAsCheckBox="true"  editType="booleanedit"></ej:Column>

                                        <ej:Column Field="AllowDelete" HeaderText="ลบ" Width="20" TextAlign="Left" displayAsCheckBox="true"  editType="booleanedit"></ej:Column>

                                        <ej:Column Field="AllowPrint" HeaderText="พิมพ์" Width="20" TextAlign="Left" displayAsCheckBox="true"  editType="booleanedit"></ej:Column>

                                    </Columns>

                                    <EditSettings AllowEditing="True"></EditSettings>

                                    <ToolbarSettings ShowToolbar="True" ToolbarItems="edit,update"></ToolbarSettings>

                                </ej:Grid>

after i select template from dropdown i want to load template and bind to my grid , but this code not working.

function permissionChange(e) {

            $.ajax({

                type: "POST",

                contentType: "application/json; charset=utf-8",

                url: '<%=ResolveUrl("Users.aspx/GetPermissionGroup")%>',

                data: '{group: "' + e.value + '" }',

                 datatype: "json",

                success: function (result) {

                    $('#<%=grdPage.ClientID%>').ejGrid({

                        dataSource: jQuery.parseJSON(result.d).menuPermistList

                    });

                    $('#<%=grdCompanyList.ClientID%>').ejGrid({

                        dataSource: jQuery.parseJSON(result.d).companyPermissionList,

                        

                    });

                    $('#<%=grdAccountGroup.ClientID%>').ejGrid({

                        dataSource: jQuery.parseJSON(result.d).accountGroupPermistList

                    });

                  },

                error: function (xmlhttprequest, textstatus, errorthrown) {

                    swal("Can not get permission group!");

                     console.log("error: " + errorthrown);

                 }

              });

        }

[Thavasianand Sankaranarayanan]

Hi Athiwat, 

Thanks for contacting Syncfusion support. 

As per your given detail we suspect that while doing ajax post with in ASP.Net webforms, then it is not working. When we call for the server end we suggest you to JSON.Stringify the data, which we pass to server end.    

Refer the below code example. 

[Default.aspx] 

<script type="text/javascript"> 

        function PermissionChange(args) { 

 

            var SelectedData = JSON.stringify({ gridSelectedData: record }); 

           $.ajax({ 

                type: "POST", 

                url: "/Grid/GridFeatures.aspx/Data", 

                datatype: "json", 

                contentType: "application/json; charset=utf-8", 

                data: SelectedData, 

                success: function (result) { 

                     

                   // Do your stuff here               

 

                }, 

                error: function (args) { 

                    alert('error occurred'); 

                } 

            }); 

        } 

    </script> 

---------------------------------------------------------------------------------- 

[Default.aspx.cs] 

        [WebMethod] 

        [ScriptMethod(ResponseFormat = ResponseFormat.Json)] 

        public static object Data(Orders gridSelectedData) 

        { 

            // Do your stuff here 

 

        } 

If you still face the same issue then please provide the following details for better assistance. 

1. Did you get the server side method get hit ?
2. If you face any script error in console then share those details.
3. Share the server end code example.
4. Share the Essential Studio version details.

Regards, 

Thavasianand S. 

[Athiwat]

Thank for the reply now it work.

[Thavasianand Sankaranarayanan]

Hi Athiwat, 

 

We are happy that the problem has been solved. 

 

Please get back to us if you need any further assistance.  

                          

Regards, 

Thavasianand S.