How to disable the button after click for avoiding duplicate entries?

< head>
< style type="text/css">
.Normal
{
border: dashed 1px #000000;
background-color: #FFFFFF;
cursor: pointer;
}

.Progress
{
border: dashed 1px #000000;
background-color: #EEEEEE;
background-position: center center;
background-repeat: no-repeat;
cursor: wait;
}
</style>

</head>

Add one div tag,Open the div tag after the < form> tag and close the div tag before the </ form> tag get closed.

< form id="frm_maintenance" runat="server">
< div id="Container" class="Normal">
.
.
.
.
.
</div>
</form>



Add this script lines into a seperate javascript file and call after the </ScriptManager> tag.

< script language="javascript" type="text/javascript" src="../Javascript/Ajax.js" />

if(Sys != null)
{
var prm = Sys.WebForms.PageRequestManager.getInstance();
prm.add_initializeRequest(InitializeRequest);
prm.add_endRequest(EndRequest);
}


function InitializeRequest(sender, args)
{
$get('Container').className = 'Progress';
$get(args._postBackElement.id).disabled = true;
}


function EndRequest(sender, args)
{
$get('Container').className = 'Normal';
$get(sender._postBackSettings.sourceElement.id).disabled = false;
}