Paging does not work while binding RadGrid Cient Side

4 posts, 0 answers
  1. Jk
    Jk avatar
    2 posts
    Member since:
    Mar 2013

    Posted 28 Mar 2013 Link to this post

    i tried numerous ways but still not able to get the paging work correctly. I am using JSON to bind the radgrid client side. Everything works  well except paging.

    Please let me know how can I get the paging work with JSOn method. I dont want to do it with Getdate() and Getcount() methods

    Attached is my code
    <%@ Page Title="" Language="C#" MasterPageFile="~/MasterPage/cp.master" AutoEventWireup="true" CodeFile="test.aspx.cs" Inherits="Secure_test" %>
     <%@ OutputCache Location="None" VaryByParam="None" %>
    <%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
    <asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server">

        <title></title>
        <script src="../Scripts/jquery-1.6.2.min.js" type="text/javascript"></script>  
        <telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">
            <script type="text/javascript">

               // function OnbuttonClient() {
               function pageLoad(sender, eventArgs) {
                    var GridData;

                    jQuery.ajax({
                        type: 'POST',
                        contentType: 'application/json; charset=utf-8',
                        data: '',
                        dataType: 'JSON',
                        url: 'test.aspx/BindGrid',
                        success: function (result) {

                            GridData = result.d;
                             if (GridData.length > 0) {

                                var divGridContainer = document.getElementById('divGridContainer');
                                divGridContainer.style.display = "";
                                var tableView = $find("<%= RadGvManageOrder.ClientID %>").get_masterTableView();
                                tableView.set_dataSource(GridData);
                                tableView.dataBind();
                                tableView.set_virtualItemCount(GridData.length);
                            }
                            else {
                                var divGridContainer = document.getElementById('divGridContainer');
                                divGridContainer.style.display = "none";
                            }
                        },
                        error: function () {
                            alert('Error on binding the data');
                        }
                    });

                    return false;

                   
                }

                function RadGrid1_RowDataBound(sender, args) {
    //                var radTextBox1 = args.get_item().findControl("OrderID"); // find control
    //                radTextBox1.set_value(args.get_dataItem()["OrderID"]);
                }

                function RadGrid1_Command(sender, args) {
                }
            </script>
            <script type="text/javascript">

                function SelectAllCheckboxesSpecific(spanChk) {

                    var IsChecked = spanChk.checked;

                    var Chk = spanChk;
                    Parent = document.getElementById('<%= RadGvManageOrder.ClientID %>');

                    var items = Parent.getElementsByTagName('input');

                    for (i = 0; i < items.length; i++) {

                        if (items[i].id != Chk && items[i].type == "checkbox") {

                            if (items[i].checked != IsChecked) {

                                items[i].click();

                            }

                        }

                    }

                }
            </script>
        </telerik:RadCodeBlock>

    </asp:Content>
    <asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">

        <div>
           
            <asp:Button ID="Button1" Text="Bind Grid" runat="server" OnClientClick="return OnbuttonClient();" />
            <div id="divGridContainer" style="display: none;">
             <asp:UpdatePanel ID="UpdatePanel1" runat="server">
             <ContentTemplate>
                <telerik:RadGrid ID="RadGvManageOrder" runat="server" PageSize="4"
                runat="server" BorderStyle="None" GridLines="None" AutoGenerateColumns="False" AllowPaging="True" AllowSorting="True">
               <ExportSettings HideStructureColumns="true" />
                   <MasterTableView  ToolTip="Right click for more details.">
                                                                <RowIndicatorColumn FilterControlAltText="Filter RowIndicator column">
                                                                    <HeaderStyle Width="20px"></HeaderStyle>
                                                                </RowIndicatorColumn>
                                                                <ExpandCollapseColumn FilterControlAltText="Filter ExpandColumn column">
                                                                    <HeaderStyle Width="20px"></HeaderStyle>
                                                                </ExpandCollapseColumn>
                                                                <EditFormSettings>
                                                                    <EditColumn FilterControlAltText="Filter EditCommandColumn column">
                                                                    </EditColumn>
                                                                </EditFormSettings>
                                                                <Columns>
                                                                <telerik:GridTemplateColumn  ItemStyle-CssClass="td" HeaderText="OrderSelected" UniqueName="OrderSelected" DataField="OrderID">
                                                                        <HeaderTemplate>
                                                                            <asp:CheckBox ID="chkAll" onclick="javascript:SelectAllCheckboxesSpecific(this);"
                                                                                runat="server" />
                                                                        </HeaderTemplate>
                                                                        <ItemTemplate>
                                                                            <asp:CheckBox ID="chkThis" runat="server" />
                                                                            <asp:Label ID="lbl_OrderId" Visible="false" runat="server" ></asp:Label>
                                                                            <%--<asp:Label ID="lbl_SourceID" runat="server" Visible="false" Text='<%#Eval("SourceID") %>'></asp:Label>--%>
                                                                        </ItemTemplate>
                                                                    </telerik:GridTemplateColumn>
                                                                   
                                                                    <telerik:GridBoundColumn ItemStyle-CssClass="td" DataField="OrderNo" HeaderText="Customer Job Number" SortExpression="OrderNo">
                                                                    </telerik:GridBoundColumn>
                                                                    
                                                                    <telerik:GridTemplateColumn ItemStyle-CssClass="td" HeaderText="eMerx Job Number" UniqueName="JobNumber" SortExpression="OrderID">
                                                                        <ItemTemplate>
                                                                            <input type="hidden" id="radGridClickedRowIndex" name="radGridClickedRowIndex" />
                                                                            <asp:Label ID="lblTargetShippingDate" runat="server" Visible="false"></asp:Label>
                                                                            <asp:Label ID="lblOrderID" runat="server" ></asp:Label>
                                                                        </ItemTemplate>
                                                                    </telerik:GridTemplateColumn>


                                                                    <telerik:GridBoundColumn ItemStyle-CssClass="td" DataField="OrderDate" HeaderText="Customer Order Date" SortExpression="OrderDate" >
                                                                    </telerik:GridBoundColumn>
                                                                    <telerik:GridBoundColumn ItemStyle-CssClass="td" DataField="CreatedOn" HeaderText="Submitted On" SortExpression="CreatedOn">
                                                                    </telerik:GridBoundColumn>
                                                                    <telerik:GridBoundColumn ItemStyle-CssClass="td" DataField="OrderStatus" HeaderText="Order Status" SortExpression="OrderStatus">
                                                                    </telerik:GridBoundColumn>
                                                            <%--        <telerik:GridBoundColumn DataField="NoOfItems" HeaderText="Quantity" SortExpression="NoOfItems">
                                                                    </telerik:GridBoundColumn>--%>

                                                                    
                                                                     <telerik:GridTemplateColumn ItemStyle-CssClass="td" HeaderText="Track Package" UniqueName="TrackOrder" HeaderStyle-ForeColor="#1F476F">
                                                                              <ItemTemplate><%--onclick='Open(this.id,<%#Eval("OrderID")%>);return false;'--%>
                                                                              
                                                                                 <%--   <a href="javascript:;" target="_blank" style='display:<%#Eval("ShipMethod").ToString()=="Manual" ? "none" : "block"%>;' id='anchor<%#Eval("OrderID")%>' onclick='Open(this.id,<%#Eval("OrderID")%>);return false;' >
                                                                                        Track Package</a>--%>
                                                                                       <%-- <a href="javascript:;" target="_blank" style='display:<%#Eval("ShipMethod").ToString()=="Manual" ? "block" : "none"%>;' onclick='notify();return false;'>Track Package</a>
                                                                               --%> </ItemTemplate>

                                                                    <HeaderStyle ForeColor="#1F476F"></HeaderStyle>
                                                                             </telerik:GridTemplateColumn>

                                                                   <%-- <telerik:GridBoundColumn DataField="BinNumbers" HeaderText="Bin Number" SortExpression="BinNumbers">
                                                                    </telerik:GridBoundColumn>--%>



                                                                    <telerik:GridButtonColumn ItemStyle-CssClass="td" ButtonType="LinkButton" HeaderText="Cancel Order" CommandName="CancelOrder"
                                                                        UniqueName="CancelOrderColumn" Text="Cancel Order" ConfirmDialogType="RadWindow" ConfirmText="Are you sure you want to Cancel this order?" >
                                                                        <ItemStyle HorizontalAlign="Center" />
                                                                    </telerik:GridButtonColumn>
                                                                   <%-- <telerik:GridButtonColumn ButtonType="LinkButton" HeaderText="Re-Processing" CommandName="ReProcessing"
                                                                        UniqueName="ReProcessingColumn" Text="Re-Processing">
                                                                        <ItemStyle HorizontalAlign="Center" CssClass="MyImageButton" />
                                                                    </telerik:GridButtonColumn>--%>
                                                                    <telerik:GridTemplateColumn ItemStyle-CssClass="td" HeaderText="" UniqueName="OrderStatusCol">
                                                                        <ItemTemplate>
                                                                            <asp:Label ID="lblOrderStatus" runat="server" Visible="false" ></asp:Label>
                                                                        </ItemTemplate>
                                                                    </telerik:GridTemplateColumn>
                                                                </Columns>
                                                                <CommandItemSettings ShowExportToWordButton="true" ShowExportToExcelButton="true"
                                                                    ShowExportToCsvButton="true" />
                                                            </MasterTableView>

                    <PagerStyle Position="TopAndBottom"/>
                 <ClientSettings>
                <ClientEvents OnCommand="RadGrid1_Command" OnRowDataBound="RadGrid1_RowDataBound">
                </ClientEvents>
            </ClientSettings>
                   
                </telerik:RadGrid>
                 <telerik:RadContextMenu ID="RadMenu1" runat="server"
                                                            EnableRoundedCorners="true" EnableShadows="true">
                                                            <Items>
                                                                <telerik:RadMenuItem Text="Order Detail" />                                                           
                                                                <telerik:RadMenuItem Text="Modify Quantity" />
                                                                <telerik:RadMenuItem Text="Change Target Date" />
                                                            </Items>
                                                        </telerik:RadContextMenu>
                </ContentTemplate>
                </asp:UpdatePanel>
            </div>
        </div>
       
    </asp:Content>


    COde File

    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Web;
    using System.Web.UI;
    using System.Web.UI.WebControls;
    using System.Drawing;
    using cpPresenter;
    using cpModel;
    using cpView;
    using Telerik.Web.UI;
    using System.Text;
    using System.Web.Services;

    public partial class Secure_test : System.Web.UI.Page,IManageOrder
    {

        static string _sourceId = "";
        Int32? _EmployeeID;
        ManageOrder _manageOrder;
        protected void Page_Load(object sender, EventArgs e)
        {
            if (Request.QueryString["sid"] != null)
            {
                _sourceId = CommonFunctions.Decrypt(Request.QueryString["sid"]).ToString();
            }
            else
                _sourceId = Session["SourceId"].ToString();

          
        }
        [WebMethod]
        public static List<GetOrdersData4CP_Result> BindGrid()
        {

            return ManageOrder.GetdataTest(null, null, "3", null, null, null, null, null, null, null, null);
           
           // return ManageOrder.GetPhysicalPrinters();
           
        }



       
        public int? EmployeeID
        {
            get { return Session["EmployeeID"] != null ? Convert.ToInt32(Session["EmployeeID"]) : 0; ; }
            set { _EmployeeID = value; }
        }

    }
  2. Jayesh Goyani
    Jayesh Goyani avatar
    2732 posts
    Member since:
    May 2010

    Posted 29 Mar 2013 Link to this post

    Hello,

    For that you have to below method to bind your Grid. (because if we bind radgrid with manully than also we have to manage pagging manully).

    http://demos.telerik.com/aspnet-ajax/grid/examples/client/declarativedatabinding/defaultcs.aspx

    Thanks,
    Jayesh Goyani
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Jk
    Jk avatar
    2 posts
    Member since:
    Mar 2013

    Posted 29 Mar 2013 Link to this post

    Does that mean JSON method will not work in case of paging?
  5. Jayesh Goyani
    Jayesh Goyani avatar
    2732 posts
    Member since:
    May 2010

    Posted 31 Mar 2013 Link to this post

    Hello,

    Does that mean JSON method will not work in case of paging?  YES

    because you want to bind your grid manually that's why you also have to manage pagging manually.

    Thanks,
    Jayesh Goyani
Back to Top