Problem with ModalPopupExtender in AJAX in asp.net c# - c#

I have one form to save customer details.For that i have used updatepanel & formview. Also i used modalpopupextender to open popup in Click event of image button inside that form. But when i am using modalpopupextender then i cant save my customer details, without use of modalpopupextender i can save customer details. For that i have added code as following, but its giving error as "An extender can't be in a different UpdatePanel than the control it extends." :
<asp:ImageButton ID="imb1"
Text="Refresh Panel"
runat="server" />
<asp:ScriptManager ID="ScriptManager1"
runat="server" />
<asp:UpdatePanel ID="UpdatePanel1"
UpdateMode="Conditional"
runat="server">
<Triggers>
<asp:AsyncPostBackTrigger ControlID="imb1" />
</Triggers>
<ContentTemplate>
// Here is my code to add
</ContentTemplate>
</asp:UpdatePanel>
Please help me what to do?
Asp.net c#

This error raises because your button which is used to open popup in updatepanel and your modal popup in any other update panel or you have placed it out of update panel.
Solution 1: place modal popup inside update panel in which your calling popup button exist.
solution 2: place button outside update panel and modal popup too.
Both things should be placed in same condition if button in update panel then popup should also be in same update panel And if button outside update panel then popup also outside update panel.
If you find your solution kindly mark my answer and point it up,thanks.

You're receiving this error because the TargetControlID, assuming it's the image button, resides outside of the update panel.

Related

asp.net submit button inside update panel and fileupload controls

I have 3 file upload controls where people upload csv files. If my submit button isn't inside an update panel the file upload have the files in the code behind and everything works fine. However, I would like my submit button inside an update panel as based on some other controls on the form I enable/disable the button via the update panel. This enabling and disabling works fine, but now in the button click codebehind the file upload controls always have null values even though a csv file was selected.
Why is the update panel around my submit button causing the file upload controls to not have anything in them even though files were selected?
So I have a FileUpload control on the page like:
<asp:FileUpload ID="file1" runat="server" />
I have a submit button in an update panel like:
<asp:UpdatePanel ID="pnlSubmitButton" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<asp:Button ID="button1" runat="server" Test="Submit" onclick="button1_Click" />
</ContentTemplate>
</asp:UpdatePanel>
In my code behind on the button click event
protected void button1_Click(object sender, EventArgs e)
{
// file1.FileName is empty even though I did select a file
}
If I remove the update panel around the button file1.FileName in the button click is then populated
As far as I know, asp:FileUpload wont works under UpdatePanel async trigger. You need to set upload button click under post back trigger to make it working. Something like this:
<triggers>
<postbacktrigger controlid="btnSubmit"/>
</triggers>

ajaxToolkit:AjaxFileUpload not working when updatepanel in same page is triggered

I have the following situation:
A master page with a usercontrol inside an update panel that triggers each minute by a timer.
In a content page i have an ajaxToolkit:AjaxFileUpload which have the functionality drag and drop, at page load the upload control is working fine but after the first trigger on the update panel the control stops working.
Thanks in advance.
I was able to replicate the issue and solve it by placing the AjaxFileUpload control inside of the ContentTemplate node of an UpdatePanel.
If you place it in its own UpdatePanel, make sure the UpdateMode is set to "Always". If you want it to be "Conditional", you'll need to have it be updated with the trigger in some way.
<asp:UpdatePanel ID="UpdatePanel2" runat="server" UpdateMode="Always">
<ContentTemplate>
<ajaxToolkit:AjaxFileUpload ID="AjaxFileUpload2" runat="server" />
</ContentTemplate>
</asp:UpdatePanel>

Postback trigger for button inside a usercontrol in Updatepanel

I have a user control placed inside an update panel, ie like this.
<asp:UpdatePanel ID="testupdatepnl" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<uc1:TestControl ID="ctlTest" runat="server" />
</ContentTemplate>
</asp:UpdatePanel>
Now i got a button placed inside this user control say Click. I want to postback the whole page on the button click.
I tried to add a postback trigger like this
<Triggers>
<asp:PostBackTrigger ControlID="clickButton" />
</Triggers>
Since the button is inside the usercontrol , i got error while running like this.
Is there any way to do a postback for this button.
Remove the <Triggers> from HTML & Add this to PageLoad event
ScriptManager scriptManager = ScriptManager.GetCurrent(this.Page);
scriptManager.RegisterPostBackControl(WebUserControl11.FindControl("ButtonId"));
Note : Learned from this
Because button you are using as trigger is placed inside update panel and after render its client id gets changed.
Make the button accessable from user control and declare the trigger at server side e.g.
var ClickButton= ctlTest.FindControl("clickButton") as Button;
var trigger = new PostBackTrigger();
trigger.ControlID = ClickButton.UniqueID.ToString();
testupdatepnl.Triggers.Add(trigger);
See the following thread for more details
Trigger a button inside a UpdatePanel with a LoginView
You should also note that if you are using Ajax Control Toolkit. You can replace ScriptManager to ToolkitScriptManager.
Dim btn As Button = CType(UserControl.FindControl("ButtonID"), Button)
AjaxControlToolkit.ToolkitScriptManager.GetCurrent(Page).RegisterPostBackControl(btn)

How can I prevent a page from going to the top every time a button with OnClick event is clicked?

How can I prevent a page from going back to the top every time a button is click? I still want to execute the code on the "OnClick" event for the button.
Example:
Almost all of our forms have a button on the bottom of the page which are suppose to bring some data back from the DB and populate some labes and textboxes located on the bottom of the page, when the button is click it takes user back to the top of the page. How can I prevent this from happening?
Any help will be really appreciate it.
Assuming the OnClick event is handled on the server and not in javascript, the easiest thing is wrap the controls to be updated in an UpdatePanel and have the update panel trigger on the button's click event.
Here is an example from Microsoft's documentation:
<asp:Button ID="Button1"
Text="Refresh Panel"
runat="server" />
<asp:ScriptManager ID="ScriptManager1"
runat="server" />
<asp:UpdatePanel ID="UpdatePanel1"
UpdateMode="Conditional"
runat="server">
<Triggers>
<asp:AsyncPostBackTrigger ControlID="Button1" />
</Triggers>
<ContentTemplate>
<fieldset>
<legend>UpdatePanel content</legend>
<%=DateTime.Now.ToString() %>
</fieldset>
</ContentTemplate>
</asp:UpdatePanel>
There are two options:
Use ASP.NET Ajax, in particular the UpdatePanel control
Set MaintainScrollPositionOnPostback to true on page level or in web.config
in your page declaration you can add MaintainScrollPositionOnPostback="true" ie:
<%# Page Language="C#" ... MaintainScrollPositionOnPostback="true" %>
you can also put that in your web.config under system.web or declare it from codebehind Page.MaintainScrollPositionOnPostback=true;
In the function handler for the button make sure you return false. You might be actually posting the page with those buttons rather than just doing something on the click event.

How do you use an UpdatePanel properly?

I have an UpdatePanel with some checkboxes in it. I check them, and hit my Save button, but that causes the UpdatePanel to postback (refresh) and sets them all back to blank. The re-drawing method runs before the button code.
What is the correct way to have an UpdatePanel with checkboxes in that you can manipulate?
Example of code:
<asp:UpdatePanel runat="server" UpdateMode="Conditional" ID="updatePanel1">
<ContentTemplate>
<asp:CheckBox runat="server" ID="myCheckBox" Caption="CheckBox"/>
<asp:Button runat="server" ID="saveButton"
Caption="Save" OnClick="SaveButtonClick"/>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="saveButton" EventName="Click" />
</Triggers>
</asp:UpdatePanel>
Make sure that:
UpdateMode of UpdatePanel is Conditional
SaveButton contained in Triggers-section as ControlID of AsyncPostBackTrigger
Your code behind should look like:
if(!page.ispostback)
{
re-drawing();
}
As when you hit Save button your re-drawing() method is called and it again refreshes your checkboxes. Asynchronous postback behaves and hit to page method the same as full postback, but refreshes the values in any updatepanels.
Also check this URL
http://ajax.net-tutorials.com/controls/updatepanel-control/
Make sure the Save button is inside the Update Panel, for a start, and if not, that is designated as a Trigger for the Update Panel, in the <Triggers> section of the Update Panel.
<asp:UpdatePanel ID="MyControlPanel" runat="server" UpdateMode="Conditional">
<Triggers>
<asp:AsyncPostBackTrigger ControlID="SaveButton" />
</Triggers>
<ContentTemplate> ...
Can you show some code for your UpdatePanel?
If you use server controls to render checkboxes you should add EnableViewState="true" attribute to these controls and update panel.
If you have checkboxes that are not server controls, then remove them from update panel, include only server controls inside. This leads to keeping several updates panel on a page that's usually not a big issue.
Add a ScriptManager object to your page if you do not have one. Set EnablePartialRendering="true". Put your UpdatePanel anywhere else on the page and place the content you want ajaxified within a tag within your UpdatePanel.

Categories