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

Page navigation (Pager Position)

7 Answers 205 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Silvio Silva Junior
Top achievements
Rank 2
Silvio Silva Junior asked on 12 Dec 2013, 04:21 PM
Hi, i'm trying to set only the position of pager text. What i'm trying to do is this: i want the page navigation in the bottom of the page, and the pager text in the top of the page. Is that possible?

7 Answers, 1 is accepted

Sort by
0
Jayesh Goyani
Top achievements
Rank 2
answered on 13 Dec 2013, 05:41 AM
Hello,

yes, this is possible but for that we have to use jquery.

//remove navigation control form top pager
$("#RadGrid1 .rgPagerCell:first").find('div').not(".rgInfoPart").css('display','none')
 
 
// Remove text from bottom pager
$("#RadGrid1 .rgPagerCell:last").find('.rgInfoPart').css('display','none');

Before


After


Let me know if any concern.

Note : You can execute this Java-script code by using below method.
1. document.ready method of java-script.
2. from backend using (ScriptManager.RegisterStartupScript/Page.ClientScript.RegisterStartupScript)
3. using Radgrid's client event
4. using settimeinterval method of java-script

Thanks,
Jayesh Goyani
0
Silvio Silva Junior
Top achievements
Rank 2
answered on 13 Dec 2013, 12:44 PM
Thank's Jayesh

There is only one problem, how do i do this? Could you please give me an exemple ? I want that the function execute on the page load.

thanks
0
Silvio Silva Junior
Top achievements
Rank 2
answered on 13 Dec 2013, 01:34 PM
Im trying to execute, but show to me an syntax error. 
To be more specific, this error: 
Exception was thrown at line 5263, column 7 in http://localhost:8538/Scripts/jquery-1.8.2.js
0x800a139e - Erro em tempo de execução do JavaScript: SyntaxError
0
Accepted
Jayesh Goyani
Top achievements
Rank 2
answered on 16 Dec 2013, 06:06 AM
Hello,

public partial class Forum : System.Web.UI.Page
{
 
    protected void Page_Init(object source, System.EventArgs e)
    {
 
    }
 
    protected void Page_Load(object sender, EventArgs e)
    {
         
    }
    protected void RadGrid1_NeedDataSource(object sender, GridNeedDataSourceEventArgs e)
    {
 
        DataTable dt = new DataTable();
 
        dt.Columns.Add("ID", typeof(int));
        dt.Columns.Add("Name", typeof(string));
        dt.Columns.Add("Customdate", typeof(DateTime));
 
        dt.Rows.Add(1, "name1", DateTime.Now);
        dt.Rows.Add(2, "name2", DateTime.Now.AddYears(-1));
        dt.Rows.Add(3, "name3", DateTime.Now.AddYears(1));
 
        RadGrid1.DataSource = dt;
    }
}
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Forum.aspx.cs" Inherits="Forum" %>
 
 
<!DOCTYPE html>
<html>
<head runat="server">
    <title></title>
    <script src="Script/jquery-1.8.2.js"></script>
    <script>
 
        $(document).ready(function () {
            setpager();
        });
 
        function setpager() {
            $("#RadGrid1 .rgPagerCell:first").find('div').not(".rgInfoPart").css('display', 'none');
            $("#RadGrid1 .rgPagerCell:last").find('.rgInfoPart').css('display', 'none');
        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
        <telerik:RadScriptManager ID="RadScriptManager1" runat="server"></telerik:RadScriptManager>
        <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server"></telerik:RadAjaxManager>
        <telerik:RadGrid ID="RadGrid1" runat="server" AutoGenerateColumns="false" OnNeedDataSource="RadGrid1_NeedDataSource"
            AllowPaging="true">
            <MasterTableView>
                <Columns>
                    <telerik:GridBoundColumn DataField="ID" UniqueName="ID" HeaderText="ID"></telerik:GridBoundColumn>
                </Columns>
            </MasterTableView>
            <PagerStyle AlwaysVisible="true" Position="TopAndBottom" />
        </telerik:RadGrid>
    </form>
</body>
</html>

Can you please try with above code snippet ?
Let me know if any concern.

Thanks,
Jayesh Goyani
0
Silvio Silva Junior
Top achievements
Rank 2
answered on 16 Dec 2013, 11:31 AM
Hi man, still not working. Could you take a look at my code? 



the error is this:
error: Exception was thrown at line 5263, column 7 in http://localhost:8538/Scripts/jquery-1.8.2.js 0x800a139e - JavaScript runtime error: SyntaxError

<%@ Page Title="Home Page" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="WebApplication1._Default" %>
<%@ Register assembly="Telerik.Web.UI" namespace="Telerik.Web.UI" tagprefix="telerik" %>

<asp:Content runat="server" ID="FeaturedContent" ContentPlaceHolderID="FeaturedContent">
    <script src="Script/jquery-1.8.2.js"></script>
    <script>

        $(document).ready(function () {
            setpager();
        });

        function setpager() {
            $("#grdTeste .rgPagerCell:first").find('div').not(".rgInfoPart").css('display', 'none');
            $("#grdTeste .rgPagerCell:last").find('.rgInfoPart').css('display', 'none');
        }
    </script>
    <section class="featured">
        <div class="content-wrapper">
            <hgroup class="title">
                <h1><%: Title %></h1>
            </hgroup>
        </div>
    </section>
    <table width="100%" height="100%" cellspacing="0" cellpadding="0" border="0">

                <tbody>
                    <tr>
                        <td width="50%" valign="bottom" height="25">
                              <font id="tituloTela" style="padding-left:6px"> Feriados </font>
                            <input id="Button1" type="button" value="button" onclick="setpager();"/>
                        </td>
                    </tr>
                </tbody>
    </table>
</asp:Content>
<asp:Content runat="server" ID="BodyContent" ContentPlaceHolderID="MainContent">
    <telerik:RadGrid ID="grdTeste" runat="server" AllowAutomaticDeletes="True" AllowAutomaticInserts="True" AllowAutomaticUpdates="True" AllowPaging="True" AllowSorting="True" CellSpacing="0" 
        DataSourceID="SqlDataSource" GridLines="None" PageSize="5" OnNeedDataSource="RadGrid1_NeedDataSource" >
        <ExportSettings>
            <Pdf PageWidth="">
            </Pdf>

        </ExportSettings>
        <MasterTableView AutoGenerateColumns="False" DataKeyNames="COD_FERIADO" DataSourceID="SqlDataSource" CommandItemDisplay="Top" >
            <CommandItemSettings AddNewRecordText="Adicionar Novo Registro" RefreshText="Atualizar"/>
            <Columns>
                <telerik:GridBoundColumn DataField="DATA" FilterControlAltText="Filter DATA column" HeaderText="DATA" SortExpression="DATA" UniqueName="DATA">
                </telerik:GridBoundColumn>
                <telerik:GridBoundColumn DataField="NOME" FilterControlAltText="Filter NOME column" HeaderText="NOME" SortExpression="NOME" UniqueName="NOME">
                </telerik:GridBoundColumn>
                <telerik:GridBoundColumn DataField="COD_FERIADO" DataType="System.Int32" FilterControlAltText="Filter COD_FERIADO column" HeaderText="COD_FERIADO" ReadOnly="True" SortExpression="COD_FERIADO" UniqueName="COD_FERIADO">
                </telerik:GridBoundColumn>
            </Columns>
            <EditFormSettings>
                <EditColumn UniqueName="EditCommandColumn1" FilterControlAltText="Filter EditCommandColumn1 column"></EditColumn>
            </EditFormSettings>

            <PagerStyle Position="TopAndBottom" AlwaysVisible="true"></PagerStyle>
        </MasterTableView>
    </telerik:RadGrid>
    <asp:SqlDataSource ID="SqlDataSource" runat="server" ConnectionString="<%$ ConnectionStrings:StringConexao %>" 
        DeleteCommand="DELETE FROM feriados WHERE (COD_FERIADO = @COD_FERIADO)" 
        SelectCommand="SELECT DATA, NOME, COD_FERIADO FROM feriados" 
        UpdateCommand="UPDATE feriados SET NOME = @NOME, DATA = @DATA WHERE (COD_FERIADO = @COD_FERIADO)" 
        InsertCommand="INSERT INTO feriados VALUES (NEXT VALUE FOR SEQ_FERIADO_NOVA, @DATA, @NOME)">
        <DeleteParameters>
            <asp:Parameter Name="COD_FERIADO" />
        </DeleteParameters>
        <InsertParameters>
            <asp:Parameter Name="DATA" />
            <asp:Parameter Name="NOME" />
        </InsertParameters>
        <UpdateParameters>
            <asp:Parameter Name="NOME" />
            <asp:Parameter Name="DATA" />
            <asp:Parameter Name="COD_FERIADO" />
        </UpdateParameters>
    </asp:SqlDataSource>
</asp:Content>
0
Accepted
Konstantin Dikov
Telerik team
answered on 17 Dec 2013, 11:33 AM
Hello Silvio,

I have tested the provided code snippet on my end and I am not able to replicate the error that you are receiving. Furthermore, the current setpage() function you have will not work, since the client ID of the RadGrid is not "grdTeste", but is something like "ctl00_MainContent_grdTeste_ctl00".

Could you please try replace your setpage() function with the following and see if the issue is resolved:
function setpager() {
    var id = "<%=grdTeste.ClientID%>";
    $("#" + id + " .rgPagerCell:first").find('div').not(".rgInfoPart").css('display', 'none');
    $("#" + id + " .rgPagerCell:last").find('.rgInfoPart').css('display', 'none');
}

Hope that helps.


Regards,
Konstantin Dikov
Telerik
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.
0
Silvio Silva Junior
Top achievements
Rank 2
answered on 17 Dec 2013, 11:42 AM
Thank you a lot Konstantin! Now it's working! Really thanks
Regards

Tags
Grid
Asked by
Silvio Silva Junior
Top achievements
Rank 2
Answers by
Jayesh Goyani
Top achievements
Rank 2
Silvio Silva Junior
Top achievements
Rank 2
Konstantin Dikov
Telerik team
Share this question
or