Javascript – stop double postback

asp.netc++javascriptupdatepanelvb.net

Here is what I am doing. I create two buttons in a header row of a gridview that i created. The buttons are +page and -page. When -page is hit I remove the paging and all the data goes down the page and -page disappears and +page is there.

Here comes my issue When I hit +page I must be double postbacking because one row of my data disappears. I will provide the code below. What can i do to fix this??

Dim bttnrempag As New Button
    bttnrempag.ID = "bttnrempag"
    bttnrempag.Text = "      Paging"
    bttnrempag.CssClass = "bttnMinEG"
    bttnrempag.ValidationGroup = "alone"
    bttnrempag.Attributes.Add("onclick", "return Paging('1')")

    Dim bttnallowpag As New Button
    bttnallowpag.ID = "bttnallowpag"
    bttnallowpag.Text = "      Paging"
    bttnallowpag.ValidationGroup = "alone"
    bttnallowpag.CssClass = "bttnAddEG"
    bttnallowpag.Attributes.Add("onclick", "return Paging('0')")

———————How the buttons are added——————————————

    Dim row As New GridViewRow(-1, -1, DataControlRowType.Separator, DataControlRowState.Normal)
    row.Cells.Add(cell)
    cell.Controls.Add(bttnrempag) '36
    cell.Controls.Add(bttnallowpag)

—————————————————————————————-

function Paging(remove) {
    var gridView = $get('<%=Gridview1.ClientID %>');
    var txt2 = $get('<%=TextBox2.ClientID %>');
    if (remove == '1') {
        txt2.value = '1';
        __doPostBack('<%=UpdatePanel1.ClientID %>', '');
        return false;
    }
    else {
        txt2.value = '0';
        __doPostBack('<%=UpdatePanel1.ClientID %>', '');
        return false;
    }

Edited

<asp:UpdatePanel ID="UpdatePanel1" runat="server">
    <ContentTemplate >
        <asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>
        <asp:GridView ID="GridView1" runat="server" AllowPaging="True" 
            AutoGenerateColumns="False" BackColor="White" BorderColor="#E7E7FF" 
            BorderStyle="None" BorderWidth="1px" CellPadding="3" 
            DataSourceID="SqlDataSource1" Font-Names="Comic Sans MS" Font-Size="XX-Small"
            Caption = '<table border="" width="100%" cellpadding="3" cellspacing="0" bgcolor="#4A3C8C"><tr><td style = "font-size:X-large;font-family:Arial CE;color:White"><b>Ordering/Receiving Log</u></td></tr></table>' 
            Font-Bold="True" PageSize="15" >
            <RowStyle BackColor="#E7E7FF" ForeColor="#4A3C8C" />

            <Columns>
                      Bound Data
            </Columns>
            <FooterStyle BackColor="#B5C7DE" ForeColor="#4A3C8C" />
            <PagerStyle BackColor="#E7E7FF" ForeColor="#4A3C8C" HorizontalAlign="Right" />
            <EmptyDataTemplate>
            <head>
                <meta http-equiv="refresh" content="5;URL=/Corporate_newpo/ReceivingLog.aspx?">
            </head>
                <script type="text/javascript" >
                    var count = 6;
                    var counter = setInterval("timer()", 1000); //1000 will  run it every 1 second

                    function timer() {
                        count = count - 1;
                        if (count <= 0) {
                            clearInterval(counter);
                            //counter ended, do something here
                            return;
                        }
                        $get("timer").innerHTML = "The Table will Reload in " + count + " secs";
                    }
                </script>
                <asp:Label ID="Label1" runat="server" Font-Bold="True" Font-Size="Large" 
                    ForeColor="#993333" Text="No Data was Found for the Selected Filter"></asp:Label><br /><br />
               <span id="timer" style="font-size:medium;color:blue"></span>
            </EmptyDataTemplate>
            <SelectedRowStyle BackColor="#738A9C" Font-Bold="True" ForeColor="#F7F7F7" />
            <HeaderStyle BackColor="#4A3C8C" Font-Bold="True" ForeColor="#F7F7F7" />
            <AlternatingRowStyle BackColor="#F7F7F7" />
            <PagerTemplate>
                <small 12px""="" style="font-size:xx-small; padding-right">Go To Page</small>
                <asp:DropDownList ID="ddlPageSelector" runat="server" AutoPostBack="true" 
                    Font-Size="XX-Small" Height="19px" Width="36px">
                </asp:DropDownList>
                <asp:ImageButton ID="btnFirst" runat="server" CommandArgument="First" 
                    CommandName="Page" SkinID="pagefirst" />
                <asp:ImageButton ID="btnPrevious" runat="server" CommandArgument="Prev" 
                    CommandName="Page" SkinID="pageprev" />
                <asp:ImageButton ID="btnNext" runat="server" CommandArgument="Next" 
                    CommandName="Page" SkinID="pagenext" />
                <asp:ImageButton ID="btnLast" runat="server" CommandArgument="Last" 
                    CommandName="Page" SkinID="pagelast" />
            </PagerTemplate>
            </asp:GridView>
        </ContentTemplate> 
    </asp:UpdatePanel>

So as you can see, when one or the other is hit I set a textbox to some value then i do a partial postback to my Gridview which is in that Updatepanel.

Best Solution

I've found a nice solution that works great. It does append it's own handler, but I guess that can be fixed too.

using System.Linq;

private void GridView_OnItemDataBound(object sender, GridViewRowEventArgs e)
{
    if (e.Row.RowType == DataControlRowType.DataRow)
    {
        var buttons = e.Row.Cells.OfType<DataControlFieldCell>().SelectMany(item => item.Controls.OfType<ImageButton>());
        foreach (ImageButton imageButton in buttons)
        {
            var argument = imageButton.CommandName + "$" + imageButton.CommandArgument;
            imageButton.OnClientClick = this.Page.ClientScript.GetPostBackClientHyperlink(this.GridView, argument) + "; return false;";
        }
    }
}