Trigger asp.net update panel using hyperlink - asp.net

I am developing a website in asp.net 2010 and use asp.net controls to use Ajax.
I have an update panel that does not have _Load event and no trigger tag and should be triggered (not updated) manually by clicking a hyperlink (tag 'a'). I have to use hyperlink instead of other controls such as button for some reasons.Now I want a javascript or jquery function to trigger my update panel or call a function in server side code that triggers it.
my asp.net code:
<a id="trg" href="#div5"></a>
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
</ContentTemplate>
</asp:UpdatePanel>
my c# function that should be called to update UpdateUanel1 by clicking hyperlink trg:
protected void func()
{
Label1.Text=System.DateTime.Now.ToString();
}

Related

Partial update doesn't work with master pages

I am working on a C# asp.net web forms project. It has two master pages. I
have an user control which reads data from database,
creates an un-ordered list in html string and populates a placeholder with
it. This user control has to be automatically
refreshed every 2 minutes. I have included this usercontrol on the parent
master page. I have the following code to refresh the
user control, which I have obtained through another stackoverflow answer.
The problem is that the entire master page refreshes, and I am not sure why.
Is there a way to make that only the user control which has the UpdatePanel
refreshes?
Outer Master Page:
<body>
<form id="frmMain" role="form" method="post" runat="server">
<div>
<uc2:PendingOrders runat="server" ID="PendingOrders" />
</div>
<asp:ContentPlaceHolder ID="MainBodyContent" runat="server">
</asp:ContentPlaceHolder>
</form>
</body>
User Control:
<asp:ScriptManager ID="myScriptManager" runat="server"
EnablePartialRendering="True"></asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" UpdateMode = "Conditional"
runat="server">
<ContentTemplate>
<asp:Timer ID="Timer1" runat="server" Interval="20000"
OnTick="Timer1_Tick"></asp:Timer>
<asp:PlaceHolder runat="server" id="lblMyOrders"></asp:PlaceHolder>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="Timer1" EventName="Tick" />
</Triggers>
</asp:UpdatePanel>
User Control Code behind:
protected void Timer1_Tick(object sender, EventArgs e)
{
//This method creates the html string with data as an unordered list
and
//populates asp:PlaceHolder inte updatepanel
GetData();
}
UpdatePanel1's Content will be update by Timer1_Tick.
"entire master page refreshes" means master page's Page_Load will be call while Timer1 been trigger?
UpdatePanel always post entire page back server and only render UpdatePanel1's Content.
I had the same problem, but in our project the EnablePartialRendering was set to false on the Master Page, if set to true the whole project breaks.
To fix the problem, I defined another master page without ScriptManager and added the ScriptManager to the page in which I wanted to use UpdatePanels with the EnablePartialRendering attribute set to True.
This fixed the problem.
<asp:ScriptManager ID="myScriptManager" runat="server" EnablePartialRendering="True"></asp:ScriptManager>

update label inside updatepanel in asp.net

i need to be able to update the label text whenever i want without clicking on a button or something similar to that. the update happens based on server-client logic. i tried to use java script, but when i call the script from a function i wrote it doesn't work. now i'm trying to use updatepanel and no luck so far. i tried to use
UpdatePanel1.Update();
but it didn't refresh the label. the label defined inside the updatepanel:
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<asp:Label ID="Label3" runat="server" Text="Label" AccessKey="l"></asp:Label>
</ContentTemplate>
</asp:UpdatePanel>
is there a away to force it to refresh?
If you just want to update your label from javascript you can try this function:
<script type="text/javascript">
function updateLabel(newValue) {
$('#<%= Label3.ClientID %>').val(newValue);
}
</script>

Using TabContainer OnDemand feature to lazy load UserControl, when to perform work?

I'm trying out the OnDemand feature of the ASP.NET Ajax Control Toolkit TabContainer to delay execution of expensive operations until the tab is loaded.
On my page there are a few tabs, and each tab's content consists of a single user control
<ajaxToolkit:TabContainer ID="TabContainer1" ActiveTabIndex="0" OnDemand="True" runat="server">
<ajaxToolkit:TabPanel ID="TabPanel1" HeaderText="tab 1" runat="server" >
<ContentTemplate>
<UC:Tab1 runat="server" />
</ContentTemplate>
</ajaxToolkit:TabPanel>
<ajaxToolkit:TabPanel ID="TabPanel2" HeaderText="tab 2" runat="server">
<ContentTemplate>
<UC:Tab2 runat="server" />
</ContentTemplate>
</ajaxToolkit:TabPanel>
</ajaxToolkit:TabContainer>
Each of these user controls is then wired up to a presenter with a custom MVP framework I inherited. The presenter is executed in OnLoad
// In user control
protected override void OnLoad(EventArgs e)
{
base.OnLoad(e);
presenter.BuildView(); // this is what I want to delay until the tab is active
}
Since OnLoad is always called, regardless of the tab being active, I know it's the appropriate event to attach to. What is the proper event to attach to, so that I can achieve the same effect as the example provided here with the SqlDataSource's selecting event only firing when the tab is loaded.
Maybe override Render? Or CreateChildControls?

AJAX.NET __doPostBack changes other content

I have an application where a javascript reads the GPS location of the device and sends it to serverside script like this:
f()
{
var initialLocation= Someshit();
document.getElementById('<% = text.ClientID %>').value=initialLocation;
var button = document.getElementById('<% = Button4.ClientID %>');
button.click();
}
And i have some AJAX.NET code:
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:Button ID="Button4" runat="server" Text="PlaceHolder" onclick="Button4_Click"/>
<asp:TextBox ID="text" runat="server"></asp:TextBox>
</ContentTemplate>
</asp:UpdatePanel>
And a bit further down
<asp:UpdatePanel ID="UpdatePanel2" runat="server">
<ContentTemplate>
<div>
<some divs and asp:gridviews and god knows what >
</div>
<ContentTemplate>
</asp:UpdatePanel>
The problem is that the the last divs inner content changes when the event of UpdatePanel1 has finished. Why is that? I don't want the content outside of UpdatePanel1 to be changed whenever UpdatePanel1 is doing its thing. Please help.
The default UpdateMode is Always, in this case you want Conditional, like this:
<asp:UpdatePanel ID="UpdatePanel2" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<div>
Yadda yadda
</div>
<ContentTemplate>
</asp:UpdatePanel>
From MSDN, here's the difference:
Always - The content of the UpdatePanel control is updated for all postbacks that originate from the page. This includes asynchronous postbacks.
Conditional - The content of the UpdatePanel control is updated under the following conditions:
If the Update method of the UpdatePanel control is called explicitly.
If a control is defined as a trigger by using the Triggers property of the UpdatePanel control and causes a postback. In this scenario, the control is an explicit trigger for updating the panel content. The trigger control can be either inside or outside the UpdatePanel control that defines the trigger.
If the ChildrenAsTriggers property is set to true and a child control of the UpdatePanel control causes a postback. In this scenario, child controls of the UpdatePanel control are implicit triggers for updating the panel. Child controls of nested UpdatePanel controls do not cause the outer UpdatePanel control to be updated unless they are explicitly defined as triggers.

FileUpload control postback problem

I'm having a FileUpload control on a aspx page inside a UpdatePanel with a button on click of which I want to set a label with the filename of the selected file.
Here is the code I have:
ASPX PAGE:
<div>
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:FileUpload runat="server" ID="fuSimple"></asp:FileUpload>
<asp:Button runat="server" Text="Button" ID="btnPostback"
onclick="btnPostback_Click" />
<br />
<asp:Label ID="lblFileName" runat="server" Text="File Name: "></asp:Label>
</ContentTemplate>
</asp:UpdatePanel>
</div>
Code Behind:
protected void btnPostback_Click(object sender, EventArgs e)
{
lblFileName.Text = "File Name: " + fuSimple.FileName;
}
Every time I hit the button, I'm getting an empty string. What am I missing?
Also, when I do this without UpdatePanel it works fine.
Comments/help appreciated.
The FileUpload control is not supported with ASP.NET AJAX and Asynchronous Postbacks. They require a full postback due to the nature of how a file upload works (multipart form data).
The following question should have useful answers: FileUpload control inside an UpdatePanel without refreshing the whole page?

Resources