Using "Page.ClientScript" how would I call the function from code behind?
Code:<script type="JavaScript">
function OnBeginRequest(sender, args)
{
$get("IMGDIV").style.display="";
}
</script>
Printable View
Using "Page.ClientScript" how would I call the function from code behind?
Code:<script type="JavaScript">
function OnBeginRequest(sender, args)
{
$get("IMGDIV").style.display="";
}
</script>
snufse,
Why is it you are finding the need to do this? Can you provide a use case?
You could do this using Page.RegisterStartupScript, and in there, define the JavaScript that would call the JavaScript function on your page.
Gary
gary,
It was actually looking at alternatives to using UpdatePanel with async trigger that apparently is not working for me. So I thought calling a JS function (from code behind) that would show a progress control and likewise stop showing the progess control (when data is bound). Jus an idea.
snufse,
async trigger is working :)
but may be you still facing a problems about it, and we can provide a help.
avrail,
Thank you for the offer...
I will first work on the UpdatePanel issues etc (from my other, now a big post).
What I am really after is a progress control (like a spinning wheel) that stays on the page till my gridview is bound. Sometimes response time could be 1 second or somettimes 6-7 seconds (depending on the slection made in the dropdown list). I like the progress control to automatically be disabled at that point (or disbaled by code).
snufse,
I see where you are coming from, but rather than trying to force something to do something it isn't meant to, I would suggest that you stick with the controls that are designed specifically for that purpose. I haven't had a chance to look at your other thread yet, time constraints, but when I do, I will see if I can offer something to help.
Gary
Guys,
Just came accross this link:
http://www.codedigest.com/CodeDigest...-Net-AJAX.aspx
So I tried getting something to work, but without luck:
Code:<script type="JavaScript">
var Page;
var postBackElement;
function pageLoad()
{
Page = Sys.WebForms.PageRequestManager.getInstance();
Page.add_beginRequest(OnBeginRequest);
Page.add_endRequest(endRequest);
}
function OnBeginRequest(sender, args)
{
$get("IMGDIV").style.display="";
}
function OnEndRequest(sender, args)
{
$get("IMGDIV").style.display="none";
}
</script>
</head>
<body onload="pageLoad();">
<form id="form1" runat="server">
<div id="IMGDIV" style="display:none;position:absolute;left: 35%;top: 25%;vertical-align:middle;border-style:inset;border-color:black;background-color:White;z-index:103;">
<asp:Image ID="Image1" runat="server" ImageUrl="~/ajax-loader.gif"/>
<asp:Label ID="Label1" runat="server" Text="Loading...."/>
</div>
<asp:Button ID="Button1" runat="server" Text="Button" OnClientClick="OnBeginRequest();" style="z-index: 100; left: 20px; position: absolute; top: 235px" />
<asp:Button ID="Button2" runat="server" Text="Button" OnClientClick="OnEndRequest();" Style="z-index: 104; left: 163px; position: absolute; top: 234px" />
I will give this a try in the morning, but to help us, can you give a description of what exactly didn't work in the above?
Gary
Hi gary,
Sorry, but when I click the Button1, I expect to see the controls within the <DIV> showing a label and an image (Loading text with a spinning wheel) , this does not happen. Thank you.
Try this one:
http://msdn.microsoft.com/en-us/library/bb397432.aspx
Gary
I am still struggling calling java script functions. Below code works for Button3 but not for Button1 and Button2 (the IMGDIV is not being shown). Can somebody tell me what I am doing wrong? Thank you.
Code:<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="Default.aspx.vb" Inherits="Test_Progress_Control._Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>Untitled Page</title>
<script type="text/javascript">
var Page;
var postBackElement;
function pageLoad()
{
Sys.WebForms.PageRequestManager.getInstance().add_beginRequest(BeginRequestHandler);
Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndRequestHandler);
}
function OnBeginRequest(sender, args)
{
$get("IMGDIV").style.display="";
}
function OnEndRequest(sender, args)
{
$get("IMGDIV").style.display="none";
}
function Test()
{
return alert('Hello!');
}
</script>
</head>
<body onload="pageLoad();">
<form id="form1" runat="server">
<div id="IMGDIV" style="display:none;position:absolute;left: 35%;top: 25%;vertical-align:middle;border-style:inset;border-color:black;background-color:White;z-index:103;">
<asp:Image ID="Image1" runat="server" ImageUrl="~/ajax-loader.gif"/>
<asp:Label ID="Label1" runat="server" Text="Loading...."/>
</div>
<asp:Button ID="Button1" runat="server" Text="Button1" OnClientClick="OnBeginRequest()" style="z-index: 100; left: 20px; position: absolute; top: 235px" />
<asp:Button ID="Button2" runat="server" Text="Button2" OnClientClick="OnEndRequest();" Style="z-index: 104; left: 163px; position: absolute; top: 235px" />
<asp:Button ID="Button3" runat="Server" Text="Button3" OnClientClick="Test()" Style="z-index: 104; left: 235px; position: absolute; top: 235px" />
</form>
</body>
</html>
Now you seem to be going off on a tangent...
You seem to be trying to call OnBeginRequest and OnEndRequest directly, which is not the intention, of this pattern, but rather you hook up event handlers for those actions.
Did you try the sample that I linked to? It seemed to do exactly what you wanted.
Gary