65.9K
CodeProject is changing. Read more.
Home

Stopping the multiple postbacks of ASP.NET linkbutton

starIconstarIconstarIconstarIconstarIcon

5.00/5 (2 votes)

Sep 7, 2010

CPOL

2 min read

viewsIcon

37421

Stopping the multiple postbacks of ASP.NET linkbutton using simple JavaScript

Introduction

Assume Link Button is present on the web form. The problem is when the user has clicked on a Link Button that is causing the browser to post to the server, it will take some time for doing the operation in the server side (assume during post back, it will insert some records into database). So, in the mean time, the user has clicked the link button again and again, then those many times the page will get submitted to the server, so those many records will be inserted into the database. But the thing is whenever the user clicked on the Link button multiple times also I want to posted back to the server first time only but not on the subsequent requests. For this, generally what we do is once the client side validation is done, at the end of validation, we will disable the link button to prevent multiple submissions, but this does not work, i.e., even after disabling the link button from client side, if we click link button, it will do server side action. How can we resolve this problem? In order to resolve the above problem, we can do the following method.

Using the Code

Aspx Page

<![CDATA[<%@ Page Language="C#" AutoEventWireup="true"  CodeFile="Default.aspx.cs" Inherits="_Default" %>]]>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Link Button Click Example</title>
</head>
<script type="text/javascript" language="javascript">
    function Testing()
     {
       try
        {
            var retunboolean = true;
            var ele = document.getElementById('<%=linkButtonTesting.ClientID%>');
            
            if (ele != null && !ele.disabled)
                retunboolean = true;
            else
                retunboolean = false;
                
            if (ele != null)
                ele.disabled = true;
        }
        catch (err)
        {
            alert(err.description);
        }
         return retunboolean;
    }
</script>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:linkbutton id="linkButtonTesting" runat="server" onclientclick="return Testing();" onclick="linkButtonTesting_Click" xmlns:asp="#unknown">Check me</asp:linkbutton>
    </div>
    </form>
</body>
</html>

Code Behind

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
public partial class _Default : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
       
    }
    protected void linkButtonTesting_Click(object sender, EventArgs e)
    {
       //do some operation...
    }
}

Initially link button is enabled. Once we click on this, it will be disabled and JavaScript function will return true, so the server side action will happen. But for the next clicks onwords, I check whether the link button is disabled or not. If it is disabled, it means that it is not the first time request, then this JavaScript function will return false. So, as a restult of this, the server side action won't happen.

Points of Interest

if we click on the link button continuously, then those many times it will do postback, not only that even after disabling the linkbutton that if clicked on it then too it will do postback but using the above JavaScript, we can restrict the postback from the second time onwards.