This is a migrated thread and some comments may be shown as answers.

Paging does not work while binding RadGrid Cient Side

3 Answers 71 Views
Ajax
This is a migrated thread and some comments may be shown as answers.
Jk
Top achievements
Rank 1
Jk asked on 28 Mar 2013, 02:55 PM
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; }
    }

}

3 Answers, 1 is accepted

Sort by
0
Jayesh Goyani
Top achievements
Rank 2
answered on 29 Mar 2013, 05:33 AM
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
0
Jk
Top achievements
Rank 1
answered on 29 Mar 2013, 05:42 AM
Does that mean JSON method will not work in case of paging?
0
Jayesh Goyani
Top achievements
Rank 2
answered on 31 Mar 2013, 05:09 PM
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
Tags
Ajax
Asked by
Jk
Top achievements
Rank 1
Answers by
Jayesh Goyani
Top achievements
Rank 2
Jk
Top achievements
Rank 1
Share this question
or