[CLOSED] GridPanel Server-Side Save.

  1. #1

    [CLOSED] GridPanel Server-Side Save.

    Hi

    I've seen the good explanation about GridPanel that Vladmir posted. Thanks for this.
    I have also seen this post with no answer, asking if there is an alternative for this.
    Other posts talks about Multiple Grid Saving where I got impression some big changes will be done in the future.

    What I'd like to know is if there are plans to support this in the future if not already supported on version 1.0?

    The main issue with this is when using AjaxEvents and save two portions of data (part on Grid and part on FormPanel) in one go. To better explain what I am saying, please see below code (which I have accomplished what I needed):

    <ext:Button ID="ButtonSave" runat="server" Icon="Disk" Text="Save">
        <AjaxEvents>
            <Click OnEvent="SaveClick" Success="if (#{GridPanelContactTypeDetails}){#{GridPanelContactTypeDetails}.save();}refreshTree();"
                Before="return (checkValid(#{FormPanelDetails}) &amp;&amp; checkDirty(#{FormPanelAddress}));">
            </Click>
        </AjaxEvents>
    </ext:Button>
    So for this example, there are two ways of input data: FormPanelDetails and GridPanelContactTypeDetails with editor.
    Actually I have another FormPanel within a UserControl, but it is not relevant for this explanation.
    The user click the button Save and I AjaxEvent is performed. My issue is that I could not find a way to save the grid data in this roundtrip. The save is only taken place on Success event as you can see.

    As I said, this is working as it is for this example, but now I need to save the data of the grid as a part of the main FormPanel data. That means, I now need to work in a different example in which I need to Save a sort of Complex business object (a collection as a part of the main object). So it will be very important to save the data in one roundtrip.

    For instance, let's say I have a Mother object. Mother's first name, surname, etc, is on FormPanel.
    The Mother can have Children and this collection of Children is on Grid. My BusinesObject is prepared to save Mother &amp; Mother.Children in one go.

    Can you understand my problem?
    Can you help me to find a solution for this scenario?
    Will GridPanel support Server-Side save method in the future?

    Your help is much appreciated.

    Leo
  2. #2

    RE: [CLOSED] GridPanel Server-Side Save.

    I believe you can submit the grid's data in the same AjaxEvent as the form save using the method in this example: https://examples1.ext.net/Examples/G...mit_Two_Grids/

  3. #3

    RE: [CLOSED] GridPanel Server-Side Save.

    Hi,

    Here example which demonstrates how to save two grids in one request (submit send whole grid but saving send changed data only)

    
    <%@ Page Language="C#" %>
    <%@ Import Namespace="System.Collections.Generic"%>
    <%@ Import Namespace="System.Xml"%>
    
    <%@ Register Assembly="Coolite.Ext.Web" Namespace="Coolite.Ext.Web" TagPrefix="ext" %>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    
    <script runat="server">
        protected void Page_Load(object sender, EventArgs e)
        {
            if (!Ext.IsAjaxRequest)
            {
                this.Store1.DataSource = new object[]
                {
                    new object[] {"3m Co", 71.72, 0.02},
                    new object[] {"Alcoa Inc", 29.01, 0.42},
                    new object[] {"Altria Group Inc", 83.81, 0.28}
                };
    
                this.Store1.DataBind();
    
                this.Store2.DataSource = new object[]
                {
                    new object[] {"American Express Company", 52.55, 0.01},
                    new object[] {"American International Group, Inc.", 64.13, 0.31},
                    new object[] {"AT&amp;T Inc.", 31.61, -0.48}
                };
    
                this.Store2.DataBind();
            }
        }
    
        protected void SubmitGrids(object sender, AjaxEventArgs e)
        {
            //JSON representation
            string grid1Json = e.ExtraParams["Grid1"];
            string grid2Json = e.ExtraParams["Grid2"];
            
            StoreDataHandler dh = new StoreDataHandler("{"+grid1Json+"}");
            
            //dh.JsonData
            //dh.XmlData
            ChangeRecords<Dictionary<string, string>> data = dh.ObjectData<Dictionary<string, string>>();
        }
    </script>
    
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head id="Head1" runat="server">
        <title></title>
    </head>
    <body>
        <form id="form1" runat="server">
            <ext:ScriptManager ID="ScriptManager1" runat="server">
            </ext:ScriptManager>
            
            <ext:Store ID="Store1" runat="server">
                <Reader>
                    <ext:ArrayReader>
                        <Fields>
                            <ext:RecordField Name="company" />
                            <ext:RecordField Name="price" Type="Float" />
                            <ext:RecordField Name="change" Type="Float" />
                        </Fields>
                    </ext:ArrayReader>
                </Reader>
            </ext:Store>
            
            <ext:Store ID="Store2" runat="server">
                <Reader>
                    <ext:ArrayReader>
                        <Fields>
                            <ext:RecordField Name="company" />
                            <ext:RecordField Name="price" Type="Float" />
                            <ext:RecordField Name="change" Type="Float" />
                        </Fields>
                    </ext:ArrayReader>
                </Reader>
            </ext:Store>
            
            <ext:GridPanel 
                ID="GridPanel1" 
                runat="server" 
                StoreID="Store1" 
                Title="Grid" 
                Width="600" 
                Height="150"
                AutoExpandColumn="Company">
                <ColumnModel ID="ColumnModel1" runat="server">
                    <Columns>
                        <ext:Column ColumnID="Company" Header="Company" Width="160" Sortable="true" DataIndex="company">
                            <Editor>
                                <ext:TextField runat="server" />
                            </Editor>
                        </ext:Column>
                        <ext:Column Header="Price" Width="75" Sortable="true" DataIndex="price">
                            <Editor>
                                <ext:TextField runat="server" />
                            </Editor>
                        </ext:Column>
                        <ext:Column Header="Change" Width="75" Sortable="true" DataIndex="change">
                            <Editor>
                                <ext:TextField runat="server" />
                            </Editor>
                        </ext:Column>
                    </Columns>
                </ColumnModel>
            </ext:GridPanel>  
            
             <ext:GridPanel 
                ID="GridPanel2" 
                runat="server" 
                StoreID="Store2" 
                Title="Grid" 
                Width="600" 
                Height="150"
                AutoExpandColumn="Company">
                <ColumnModel ID="ColumnModel2" runat="server">
                    <Columns>
                        <ext:Column ColumnID="Company" Header="Company" Width="160" Sortable="true" DataIndex="company" >
                            <Editor>
                                <ext:TextField runat="server" />
                            </Editor>
                        </ext:Column>
                        <ext:Column Header="Price" Width="75" Sortable="true" DataIndex="price">
                            <Editor>
                                <ext:TextField runat="server" />
                            </Editor>
                        </ext:Column>
                        <ext:Column Header="Change" Width="75" Sortable="true" DataIndex="change">
                            <Editor>
                                <ext:TextField runat="server" />
                            </Editor>
                        </ext:Column>
                    </Columns>
                </ColumnModel>
            </ext:GridPanel>  
            
            <ext:Button runat="server" Text="Submit two grids">
                <AjaxEvents>
                    <Click OnEvent="SubmitGrids">
                        <ExtraParams>
                            <ext:Parameter Name="Grid1" Value="#{GridPanel1}.store.getChangedData()" Mode="Raw" />
                            <ext:Parameter Name="Grid2" Value="#{GridPanel2}.store.getChangedData()" Mode="Raw" />
                        </ExtraParams>
                    </Click>
                </AjaxEvents>
            </ext:Button>
        </form>
    </body>
    </html>
  4. #4

    RE: [CLOSED] GridPanel Server-Side Save.

    Hi folks,

    Thanks Jchau, thanks Vlad.
    Sorry this examples escaped my attention. I've seen it before, but I did not realised correctly what it was doing.
    Anyway, again I may have been missing something, but taken this scenario, how will I handle the data that has been changed?

    I mean, is it possible to map the data like ChangeRecords<object>?
    Is it possible to submit only the inserted, updated, deleted information?

    I don't know about Store OnSubmitData, but I already read it also submit all data.

    Do you have a example that deal with grid submit and identify the records in collections, like:

    List<T> Inserted
    List<T> Deleted
    List<T> Updated

    The tests I've done using the example you sent here is throwing an exception when trying to use ChangeRecords.

    Can you help me, please?
    Leo


  5. #5

    RE: [CLOSED] GridPanel Server-Side Save.

    Hi,

    If you look into the my posted example then you see that I send to the server changed data only (using getChangedData method) and then mapping data to the ChangedRecords object. Please test it and let me know if that example is what you need.
  6. #6

    RE: [CLOSED] GridPanel Server-Side Save.

    Ouchhh! Really sorry Vlad,

    Sorry I didn't pay attention properly in your example thinking it was identical to the one on Coolite Examples that Jchau sent.

    Fantastic. All works like a charm!

    Well Done for you again, sorry my bad!

    Leo
  7. #7

    RE: [CLOSED] GridPanel Server-Side Save.

    Vlad,

    One more two quick questions related to data mapping.
    1 - Do you really need a public constructor to do the data-mapping using:

    ChangeRecords<Unit> data = dataHandler.ObjectData<Unit>();
    Newtonsoft.Json.JsonSerializationException was unhandled by user code
      Message="Could not find a public constructor for type Unit."
      Source="Newtonsoft.Json"...
    I have to always extend my classes on UI just to handle this problem.
    I use CSLA to my BusinessObjects and the CSLA Framework does not have public constructors as it need to go to the DataPortal to get data.

    I don't know from your side, so Do you really need public constructors?

    2 - Also, my other question is:
    I could use DataSource events (Select, Update, Delete) as you mentioned in your explanation.
    The first time I tried was using those, but I don't have ObjectDataSource, neither SqlDataSource. I use CslaDataSource which inherit from IDataSource, IListSource and is completely compatible with DetailsView.
    I am not using DetailsView anymore, only Coolite controls. Does the Store events should work with CslaDataSource?

    Thanks
    Leo
  8. #8

    RE: [CLOSED] GridPanel Server-Side Save.

    Hi,

    Newtonsoft.Json toolkit is required default default constructor because oterwise it cannot create object instance
    I am not sure about CslaDataSource because I never worked with it. It is required test sample to check it

Similar Threads

  1. [CLOSED] Save ext:GridPanel.getState() in SQL Server database
    By supera in forum 2.x Legacy Premium Help
    Replies: 2
    Last Post: May 03, 2012, 11:17 AM
  2. [CLOSED] Cancel insert on store's save after server side validation.
    By SouthDeveloper in forum 1.x Legacy Premium Help
    Replies: 10
    Last Post: Nov 23, 2011, 1:16 AM
  3. Server side method to save Gridpanel
    By cpvaishya in forum 1.x Help
    Replies: 0
    Last Post: Jan 27, 2010, 1:09 AM
  4. [CLOSED] Save Gridpanel on server-side
    By egodoy in forum 1.x Legacy Premium Help
    Replies: 1
    Last Post: Jun 09, 2009, 2:45 PM
  5. Save the GridPanel Server Side
    By egodoy in forum 1.x Help
    Replies: 0
    Last Post: May 27, 2009, 1:17 PM

Posting Permissions