How to trigger an Update Panel without Page Loading all again - c#

Here is the thing:
I have a Master Page, and a couple of other Web Forms. All of them invoke User Controls, and inside the User Controls, there is an Update Panel.
Now that I add a button in the Master Page (all the pages will need that button, that's why it is in the Master Page), I need that button to show a Popup. That's ok.
The problem is that when I click the button, the page rendered again. So I put the button inside an Update Panel and set it as an Async Trigger for the Update Panel.
(imagine something like that:
Master page{
update panel {
button
}
content place holder
}
)
Now the page does not render again, but still launch the Page Load, and that is a problem.
If a page takes 5 seconds to show, because it is loading the content, the button in the master page will take 5 seconds too, because it will load all again.
Does someone know something to fix that?

I assume it's an asp.net standard button like
<asp:Button ID="Button1" runat="server" Text="Button" />
So on click of this button it fires a postback event. But the button needs to show a popup only and if no server code processing is required, better to use
<input type="button" id="Button1" value="Button"/>
Remove UpdatePanel.

Related

To stop reloading web page In Asp.net on any button click

how stop postback on any button click. My page is reloading as soon as i click on reset button on the registration page, i want to reset the form without reloading the page itself.
You have two possibilities:
Simply set the attribute AutoPostBack="false" on your button or whatever control.
As an alternative you could also add the following javascript to the click event of the button :
onclick="return false"
This prevents the button from submitting.
Try following:
<asp:button runat="server".... OnClientClick="return false;" />
First you have to know about Sever Control and normal HTML control.
If you used Server Button Control then your Page reload on each click.
If you wan to stop it then you have to use AutoPostBack="false", using this your server side method calling is stop.
Otherwise use Normal HTML Button Control and use JavaScript to reset your form.

Button is not getting visible once its visibility set to false while navigating from one page to another

Scenario:I have two ASPX page page1.aspx and page2.aspx.In page1.aspx there is one button named "VIEW" and in page2.aspx there is set of four buttons named "button 1","button 2","button 3" and "button 4" respectively which are defined under table tag and also there is one search text box along with search button click on page2.aspx.
My Problem statement is: When you click on "VIEW" button of page1.aspx,you should get navigate to page2.aspx and the set of four buttons which is on page2 should get invisible/disabled on page2.aspx and when i put some search word (for example Microsoft) in search text box and click on search button which is on page2.aspx,then all set of four buttons should get visible/enable along with the search results.
Issue that i am facing is, i am able to successfully navigate from page1.aspx to page2.aspx and set of four buttons which is on page2 is also getting invisible on page2.aspx.But,when i put some search criteria in search text box of page2.aspx and do the search by clicking on search button ,i am able to get search results,but my set of four buttons is not getting visible/enable on page2.aspx.I am using button.visible = "true" inside search_click() function in code behind file of page2.aspx.cs.
Wrap your buttons in an asp panel. Set the visible attribute of the panel to false in the aspx page so that it is false by default.
Make the panel visible from within the Search button click event.
for example within that event you only need the code:
Panel1.Visible= true
If you are using updatepanels then you should probably put your button panel in a separate updatepanel and set the updatemode to conditional. You should then be able to set a trigger on the updatepanel so that content refreshes only when the search button is clicked.
<asp:UpdatePanel ID="upButtons" runat="server" UpdateMode="Conditional" ChildrenAsTriggers="false">
<Triggers>
<asp:AsyncPostBackTrigger ControlID="btnSearch" />
</Triggers>
<ContentTemplate>
<<your buttons here>>
</ContentTemplate>
</asp:UpdatePanel>
I think your answer will be along these lines. You can also trigger an update directly from code with something like the following in your Search button click event.
upButtons.Update
Wing

UpdatePanel and modifying controls outside of the Panel

I have a control inside of an UpdatePanel. The UpdatePanel has an AsyncPostBack trigger associated with the inner control. This works just fine.
I have another control containing a SSRS ReportViewControl that I would like to conditionaly hide based on the results from the postback event of the UpdatePanel mentioned above.
The ReportViewerControl is not inside of an UpdatePanel and I would like to keep it this way. How can I hide the ReportViewerControl based on the postback event of an UpdatePanel inside of another control?
I am assuming that many problems would spring up if I place the ReportViewerControl inside of an UpdatePanel, anyone know for sure?
You could create a script inside you update panel content template and hide your control form javascript.
<script type="text/javascript">
Sys.Application.Add_load(MyFunctionThatHides);
</script
The ReportViewerControl is not inside of an UpdatePanel and I would
like to keep it this way.
I did a simple trick. I created a another Updatepanel and put a literal control side the update panel and this update panel code Is Above the "Control you want to hide"
something like this
<asp:UpdatePanel ID="UpdatePanel5" runat="server" UpdateMode="Always" >
<ContentTemplate>
<asp:Literal runat="server" ID="literal1"></asp:Literal>
</ContentTemplate>
</asp:UpdatePanel>
Then in Code behind I inject CSS
something like this
literalDvControl.Text = "<style> #YourControlID{ display:none;}</style>";
This seems to be working. Basically literal control is injecting style tag and browser is very quick to react.
but do read about this .
Using <style> tags in the <body> with other HTML
Hide the content through server side code but rather to use javascript (possibly injected by the server through a postback) as suggested by Machinegon.
Have a second UpdatePanel around the other content that you want to hide. (You can't make the current one bigger, but making a second shouldn't cause problems.) Have that second update panel set the same button as the trigger. (You can have a trigger that's outside of the update panel, you just can't update content outside of the update panel.) If the update is conditional (you only sometimes change the content when the button is clicked) then you can set the only trigger for the second panel to be a hidden button which you Click in code from the handler of the first button click.
You can use following code after processing the Async AJAX call on server and just before returning the response to client/browser
this.Page.ClientScript.RegisterStartupScript(this.GetType(), "ShowHideReportViewerJSScript", <JS code to show/hide reportviewer>, true);
I assume you have scriptmanager placed on the ASPX page

Set Active Tab for AJAX Tab Control

I have a website that uses the AJAX TabContainer and has several tab panels. Each tab panel consists of a customer user control with many controls on it. I need to be able to set the active tab whenever server-side button click event is executed. How would I go about accessing the TabContainer from the custom controls C# code behind?
My markup is structured like this:
<cc1:TabContainer ID="TabRoot" runat="server" Width="100%" CssClass="ajax__tab_yuitabview-theme" onActiveTabChanged="TabRoot_ActiveTabChanged"
OnClientActiveTabChanged="SetIndex" ActiveTabIndex="0" AutoPostBack="True">
<cc1:TabPanel ID="TabPatientRoot" runat="server" HeaderText="Patient">
<ContentTemplate>
<custom:Patient ID="PatientInfo" runat="server" Visible="False"></custom:Patient>
</ContentTemplate>
</cc1:TabPanel>
</cc1:TabContainer>
It is necessary that the server side codes executes a SaveData function before the tab panel is changed because whenever the active tab changes it loads the information for the newly selected tab panel, thus losing any information that wasn't saved on the previous tab panel.
How can I accomplish executing the server side SaveData function, and then have access to TabRoot to change the active tab? Currently I was using a javascript function (in the OnClientClick for the save button) to set the active tab but it is being executed before the server-side SaveData function. This seems to be a problem for users in IE9, only.
try like this and refer this examples Ajax Control toolkit
TabRoot.ActiveTabIndex = 0; // set your active tab index to display.
Try setting ActiveIndex of tab inside your button postback event.

ModalPopup inside the UpdatePanel with default form values

I have a ModalPopupExtender inside an UpdatePanel which opens an input form. The problem is when I click the "Edit" button (which is also inside the UpdatePanel) I want to fill the form with existing values using server side code. But it OnClick method of the button doesn't seem to work.
My question is: How can I make the serverside code run first, than show the edit form?
You need to show the ModalPopupExtender from server side.
First, link the ModalPopupExtender's TargetControlID to a dummy hiddenfield or a button with style="display:none" instead of the "Edit" button. I know it's sound stupid, but it's a know workaround.
Then make sure the asp.net the "Edit" button is set as a asyncpostbacktrigger if children as trigger is set to false.
Also set CausesValidation="false" to avoid the postback to be blocked by unrelated validators on the page.
Finally, At the end of "Edit" button's click event, call ModalPopupExtender.Show() to display the pop up.

Categories

Resources