Remote Paging using Web Service, Store and Grid generated from Code Behind

[mkshields9w57]

Hi,

I have a tabpanel in which I generate the tabs and grids that go on them within the code behind.
Depending on what the user clicks on menu, it generates tabs and grids accordingly. I can generate the tabs correctly the first time I click on menuitem. However, paging does not work. Next page button is disabled.

If I refresh using the refresh button in the paging toolbar, it gives me the same result set.

I would really appreciate it if you can help me out.

Thanks.

in aspx:

<ext:MenuItem ID="MenuItem10" runat="server" Text="TEST">
	<DirectEvents>
		<Click OnEvent="GetTESTGrid" Success="replace(#{tpnlData})" Before="clearpanel(#{tpnlData})">
			<ExtraParams>
				<ext:Parameter Name="assettype" Value="assetvalue" Mode="Value"/>
			</ExtraParams>
		</Click>
	</DirectEvents>                                                                                                                                                   
</ext:MenuItem>

in code behind:

        public void GetTESTGrid(string assettype)
        {
            GridPanel gridDatadiff = BuildGridPanel();
            AddTab(gridDatadiff, this.tpnlData);
        }

        private GridPanel BuildGridPanel()
        { 
            GridPanel grid = new GridPanel
                        {
                            Store = { this.BuildStore() },
                            SelectionModel = { new RowSelectionModel { SingleSelect = true } },
                            LoadMask = { ShowMask = true, Msg = "Paging data..." },
                            BottomBar = { new PagingToolbar { PageSize = 10 } },
                            Title = "Maturity Diff",
                            ColumnLines = true,
                            ColumnModel =
                            {
                                Columns = 
                                {
                                    new Column () {DataIndex="Field1",Header="Field1"},
                                    new Column() { DataIndex = "Field2", Header = "Field2" },
                                    new Column() { DataIndex = "Field3", Header = "Field3" },
                                    new Column() { DataIndex = "Field4", Header = "Field4" },
                                    new DateColumn() { DataIndex = "Field5", Header = "Field5" }
                                }
                            }
                        };
            return grid;
        }

        private Store BuildStore()
        {
            JsonReader rdr = new JsonReader();
            PropertyInfo[] oProps = (typeof(DSC_Data)).GetProperties();
            foreach (PropertyInfo pi in oProps)
            {
              //defind each field in DSC_Data;                
            }

            rdr.Root = "d";
            HttpProxy proxy = new HttpProxy() { Url = "MyWebService.asmx/DataDiff", Method = HttpMethod.POST, Json = true };
            
            Store store = new Store
                            {
                                ID = "storeDiff",
                                AutoLoad = true,
                                RemoteSort = true,
                                ClientIDMode = ClientIDMode.Static,
                            };
            store.Reader.Add(rdr);
            store.Proxy.Add(proxy);
            store.AutoLoadParams.Add(new ExtJS.Parameter { Name = "assettype", Value = "TEST", Mode = ParameterMode.Value });
            store.AutoLoadParams.Add(new ExtJS.Parameter { Name = "start", Value = "0", Mode = ParameterMode.Value });
            store.AutoLoadParams.Add(new ExtJS.Parameter { Name = "limit", Value = "10", Mode = ParameterMode.Value });

            store.BaseParams.Add(new ExtJS.Parameter { Name = "assettype", Value = "TEST", Mode = ParameterMode.Value });
            return store;
        }

my webservice:

        [WebMethod]
        [ScriptMethod(ResponseFormat = ResponseFormat.Json, UseHttpGet = false)]
        public List<DSC_Data> DataDiff(string assettype, int start, int limit)
        {
            ReportDataRepository rptDataRepository = new ReportDataRepository();
            List<DSC_Data> lstData = rptDataRepository.GetDataDiff("", assettype);
            if ((start + limit) > lstData.Count)
            {
                limit = lstData.Count - start;
            }

            return (start < 0 || limit < 0) ? lstData : lstData.GetRange(start, limit);
        }

[Vladimir]

WebService must return total count also
See WebService method the following example
https://examples1.ext.net/#/GridPane...ON_WebService/

[mkshields9w57]

Thanks for the reply. Got it working now as far as getting the data.

One more thing, the paging toolbar does not display the correct number of records. The Paging and Sorting JSONWeb_Service example also has the same problem. During the initial load on the examples page I get this:

Page 1 of 8
Displaying plants 01 to 05 of 36 (which looks OK)

When i click on the next page button, it shows
Page 11 of 8
Displaying plants 051 to 055 of 36

Clicking on next page shows:
Page 111 of 8
Displaying plants 0551 to 05536 of 36 (and it shows all the data from prior pages).

But if I click on the last page button, and go back to the first button it would display the message correctly for each page.

Thanks again.

[Daniil]

Hi,

Should be ParameterMode.Raw mode here:

new ExtJS.Parameter { Name = "start", Value = "0", Mode = ParameterMode.Raw});

For the "limit" parameter as well.

[mkshields9w57]

Thanks. That worked.