Selected grid details add to another grid

[Pratheep]

Hi

If I click product grid button (select button) ,selected product details  can add  to material grid ?


Thanks
Pratheep

Attachment: WebApplication1_427ce8c2.rar

[Mani Sankar Durai]

Hi Pratheep, 

Thanks for contacting Syncfusion support. 

We have analyzed your provided sample and based on your requirement we have modified your sample that can be downloaded from the below link. 

Link: https://www.syncfusion.com/downloads/support/forum/128556/ze/WebApplication168743567 

Please refer the below code example. 

<ej:Grid ID="ProductGrid" ClientIDMode="Static" runat="server" AllowPaging="True" AllowFiltering="false" OnServerEditRow="EditEvents_ServerEditRow" 

                    OnServerAddRow="EditEvents_ServerAddRow" OnServerDeleteRow="EditEvents_ServerDeleteRow"> 

                  

                    <ClientSideEvents ActionComplete="complete" RowSelected="selected" EndAdd="endAdd" EndDelete="endDelete" EndEdit="endEdit" /> 

... 

 

<script type="text/javascript"> 

 

    ... 

 

       function selected(args) { 

           var data = $('#<%= ProductGrid.ClientID %>').ejGrid("instance")._dataSource(); 

           var grid = $('#<%= ProductGrid.ClientID %>').ejGrid("instance"); 

           var record = args.data.Productcode; 

           var detaildata = ej.DataManager(data).executeLocal(ej.Query().where("Productcode", ej.FilterOperators.equal, record, false)); 

           var gridObj = $('#<%= MaterialGrid.ClientID %>').ejGrid("instance"); 

           gridObj.dataSource(ej.DataManager(detaildata)); 

       } 

 

</script> 

From the above code example we have used RowSelected event in grid to bind the selected data for the MaterialGrid. 

Refer the documentation link. 

Link: https://help.syncfusion.com/api/js/ejgrid#events:rowselected 

Please let us know if you need further assistance. 

Regards, 

Manisankar Durai. 

[Pratheep]

Hi Manisankar Durai.

Thank you for your support.Working fine

Thanks
Pratheep

[Mani Sankar Durai]

Hi Pratheep, 

We are happy to hear that your problem has been solved. 

Please let us know if you need further assistance. 

Regards, 

Manisankar Durai. 

[Pratheep]

Hi

last selected product code only showing  MaterialGrid.earlier selected codes not showing

example 

product code
0001
0002
0003

if I select 0001 that will appear at  Material Grid after that I select 0002 than 0002 only showing at MaterialGrid
Can I get all select product codes show at Material Grid (0001,0002)


 It's possible  without select ProductGrid row , client side button (Product Grid button ) click event  add  product code to MaterialGrid 

  <ej:Column HeaderText=" " Template="true" TemplateID="#buttonTemplate" TextAlign="Center" Width="75" AllowFiltering="false"/> 

      $(function () {

 

           $(".Details").ejButton({

 

               click: function (e) {

 

                         

                          

               },

           });

       }

Thanks
Pratheep

[Mani Sankar Durai]

Hi Pratheep, 

Based on your requirement we have prepared a sample that can be downloaded from the below link. 

Link: https://www.syncfusion.com/downloads/support/forum/128556/ze/WebApplication1-1511835494 

In this sample we have passed the selected data to the MaterialGrid dataSource only when clicking the select button of ProductGrid. Using dataSource property we have pushed the selected records in MaterialGrid. 

Please refer the below code example, 

$(function () { 

           $(".Details").ejButton({ 

                click: function (e) { 

                    var obj = $('#<%= ProductGrid.ClientID %>').data("ejGrid"); 

                    var record = obj.getSelectedRecords(); 

                    var gridObj = $('#<%= MaterialGrid.ClientID %>').ejGrid("instance"); 

                   if (gridObj.model.dataSource == null) 

                       gridObj.dataSource(record); 

                   else { 

                       gridObj.model.dataSource.push(record[0]);   //push the dataSource object to the grid. 

                       gridObj.refreshContent(); 

                   } 

}) 

Refer the documentation link. 

Link: https://help.syncfusion.com/api/js/ejgrid#methods:datasource 

https://help.syncfusion.com/api/js/ejgrid#members:datasource 

Please let us know if you need further assistance 

Regards, 

Manisankar Durai. 

[Pratheep]

HI Manisankar Durai.

Thank you for your help.Its working fine

Thanks
Pratheep

[Mani Sankar Durai]

Hi Pratheep, 

We are happy to hear that your problem has been solved. 

Please let us know if you need further assistance. 

Regards, 

Manisankar Durai. 

[Pratheep]

Hi

Product Grid   unable to update  Type  / delete the records

after product details  add  to material grid unable to update material  code, material  name / delete the material records

Thanks

Pratheep

Attachment: WebApplication1_68d1d438.rar

[Pratheep]

Product Grid   after  update  Type  / delete the records  select button not working

after product details  add  to material grid unable to update material  code, material  name / delete the material records

Thanks

Pratheep

Attachment: WebApplication1_fc7ccd17.rar

[Mani Sankar Durai]

Hi Pratheep, 

Query 1: Product Grid   after update Type / delete the records select button not working  

  We have analyzed your query and we suggest you to render the button inside the dataBound event of grid. Since after performing server side delete operation the template button is rendered into normal button. So upon clicking the button it didn’t fire the click event in ejButton.   

Please refer the below code example 

      <ej:Grid ID="ProductGrid" ClientIDMode="Static" runat="server" AllowPaging="True" AllowFiltering="false" OnServerEditRow="EditEvents_ServerEditRow" 

                    OnServerAddRow="EditEvents_ServerAddRow" OnServerDeleteRow="EditEvents_ServerDeleteRow"> 

                  

                    <ClientSideEvents ActionComplete="complete"  EndAdd="endAdd" EndDelete="endDelete" EndEdit="endEdit"  DataBound="databound" /> 

 

                     ... 

 

 

       function databound(args){ 

           $(".Details").ejButton({ 

                click: function (e) { 

                    ... 

               } 

             }); 

  } 

Refer the documentation link: https://help.syncfusion.com/api/js/ejgrid#events:databound 

Query 2: after product details add to material grid unable to update material code, material name / delete the material records 

 

From your sample we found that you are using the name attribute as Productcode and productname in material grid dialog template. So that when editing the value it just update the value for Productcode and Producename instead of MaterialCode and Materialname. 

Refer the below code example. 

<script type="text/template" id="materialtemplate"> 

... 

                    <input id="Materialcode" name="Materialcode" value="{{: Materialcode}}"  

... 

                    <input id="Materialname" name="Materialname" value="{{:Materialname}}" class="e-field e-ejinputtext valid" 

... 

        </table> 

    </script> 

  

Also in server side you are trying to update the product grid details using session variable in Material grid server side edit operations. Instead that we suggest you to set the updated values from client to server side in session variable and use that session variable for server side CRUD operations. So that we can update the values for Material grid. 

Refer the below code example. 

 

        protected void EditActionMaterial(string eventType, object record) 

        { 

 

            List<Materials> data = Session["MaterialDataSource"] as List<Materials>; //update the material grid records after selecting from client side. 

            Dictionary<string, object> KeyVal = record as Dictionary<string, object>; 

 

            if (eventType == "endEdit") 

            { 

                Materials value = new Materials(); 

                foreach (KeyValuePair<string, object> keyval in KeyVal) 

                { 

 

                    if (keyval.Key == "Materialcode") 

                    { 

                         

                   ... 

 

                    } 

                } 

            } 

            Session["MaterialDataSource"] = data; 

            this.MaterialGrid.DataSource = data; 

            this.MaterialGrid.DataBind(); 

 

        } 

 

 

 

 

 

        [Serializable] 

        public class Materials 

        { 

            public Materials() 

            { 

 

            } 

            public Materials(int Materialcode, string Materialname, int Productcode, string Productname) 

            { 

                this.Materialcode = Materialcode; 

                this.Materialname = Materialname; 

                this.Productname = Productname; 

                this.Productcode = Productcode; 

            } 

            public int Materialcode { get; set; } 

            public string Materialname { get; set; } 

            public int Productcode { get; set; } 

            public string Productname { get; set; } 

 

        } 

 

Please let us know if you need further assistance. 

 

Regards, 

Manisankar Durai. 

[Pratheep]

Hi Manisankar Durai.

Thank you for your support

Cant update Material Grid


List<Materials> data = Session["MaterialDataSource"] as List<Materials>;

// empty selected Product code

 

 

            if (eventType == "endEdit")

            {

                Materials value = new Materials();

                foreach (KeyValuePair<string, object> keyval in KeyVal)

                {

 

                    if (keyval.Key == "Productcode")

                    {

                        value = data.Where(d => d.Productcode == (int)keyval.Value).FirstOrDefault();

                        value.Productcode = Convert.ToInt32(keyval.Value);

                    }

                    else if (keyval.Key == "Materialname")

                        value.Materialname = Convert.ToString(keyval.Value);

                    else if (keyval.Key == "Materialcode")

                        value.Materialcode = Convert.ToInt16(keyval.Value);

 

 

                }

Thanks
Pratheep

Attachment: WebApplication1_3d6aeed8.rar

[Seeni Sakthi Kumar Seeni Raj]

Hi Pratheep,  

 

We suggest to assign the convert the Selected records to string and assign them to Hidden element. Later, in the Edit action of the Grid, get the records bound to the child Grid. Refer to the following code example.  

 

<asp:HiddenField ID="SelectRecords" ClientIDMode="Static" runat="server" /> 

 

 

   <script type="text/javascript"> 

 

      

 

       function OnCreate(args) { 

 

 

           $(".Details").ejButton({ 

 

               click: function (e) { 

 

                  var obj = $('#<%= ProductGrid.ClientID %>').data("ejGrid"); 

                   var record = obj.getSelectedRecords(); 

                   var gridObj = $('#<%= MaterialGrid.ClientID %>').ejGrid("instance"); 

                   $("#SelectRecords").val(JSON.stringify(record)); 

                    if (gridObj.model.dataSource == null) 

                        gridObj.dataSource(record); 

                    else { 

                        gridObj.model.dataSource.push(record[0]); 

                        gridObj.refreshContent(); 

                    } 

 

                } 

 

            }); 

            } 

 

</script> 

 

 

       protected void EditActionMaterial(string eventType, object record) 

        { 

 

            JavaScriptSerializer ser = new JavaScriptSerializer(); 

            //get currentView 

            List<Materials> sel = ser.Deserialize<List<Materials>>(this.SelectRecords.Value); 

             . . . 

                 .. . 

            Session["MaterialDataSource"] = data; 

            this.MaterialGrid.DataSource = data; 

            this.MaterialGrid.DataBind(); 

 

        } 

 

We have modified the sample that can be downloaded from the following location. 

 

Sample: https://www.syncfusion.com/downloads/support/forum/128556/ze/WebApplication11586431634.zip 

 

Regards, 

Seeni Sakthi Kumar S.