asp.net updatePanel PostBackTrigger triggering full postback - c#

Below is the markup page
<asp:UpdatePanel runat="server" UpdateMode="Conditional">
<ContentTemplate>
<table>
<tr>
<td>
<label>File name<label>
</td>
</tr>
<tr>
<td>
<asp:TextBox runat="server" ID="txtName" Width="150%"></asp:TextBox>
</td>
</tr>
<tr>
<td>
<label>File</label>
</td>
<td>
<asp:FileUpload runat="server" ID="fileUpload" />
</td>
</tr>
</table>
<asp:Button runat="server" ID="btnUpload" Text="Upload file" OnClick="btnUpload_Click" />
</div>
<div class="panel-heading">File display</div>
<div class="panel-body">
<asp:GridView runat="server">
</asp:GridView>
<asp:Button runat="server" ID="btnRefresh" Text="Refresh" OnClick="btnRefresh_Click" />
</div>
</div>
</ContentTemplate>
<Triggers>
<asp:PostBackTrigger ControlID="btnUpload" />
</Triggers>
</asp:UpdatePanel>
With the above code, whenever the user clicks "btnUpload", there'll be a post back, but there is an update panel to prevent the post back, when I change the PostBackTrigger to AsyncPostBackTrigger, the page didn't post back but the fileUpload.HasFile will be false and was unable to get the file.
What's wrong with the above code?Why the postBackTrigger triggers a post back?

File upload will not work with AsyncPostBackTrigger. It will only work with PostBackTrigger.
SOLUTION : If You want to upload file with AsyncPostBackTrigger than you have to use ajaxtoolkit. And in AjaxToolkit their is Control name with "AsyncFileUpload".
Hope You know how to add AjaxToolkit to your Toolbox. If you dont know than tell me i will guide you.

You have not defined event of control, you have to tell that trigger on which event of control:
<asp:AsyncPostBackTrigger ControlID="btnUpload" EventName="Click" />
UPDATE:
you have to use async postback trigger:
AsyncPostBackTrigger - use these triggers to specify a control within or outside of the UpdatePanel that, when clicked, should trigger a partial page postback.
PostBackTrigger - use these triggers to have a control within the UpdatePanel cause a full page postback rather than a partial page postback.

Related

How to prevent complete postbacks from two buttons click events in one Update Panel?

So, I have a form design section here, where there is a "save" button and a "slot grid" button. AsyncPostBackTrigger is implemented on Save button for update panel. My problem is that after selecting values from listbox which gets binded on page load,whenever i click "btnshowslotgrids" button, the listbox looses all selected values.what should i do to prevent it?
<asp:UpdatePanel ID="Upd" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<table style="width: 100%; margin: auto; min-height: 500px;">
<tr>
<td>
<asp:ListBox SelectionMode="Multiple" ClientIDMode="Static"
ID="lbEduType" runat="server"
CssClass="multiselect form-control" DataValueField="Id"
DataTextField="Name" multiple="multiple"></asp:ListBox>
</td>
<td>
<asp:Button ID="btnshowslotgrids" Text="Slot Grids" runat="server"
CssClass="btn btn-primary" OnClick="btnshowslotgrids_Click"/>
</td>
</tr>
</table>
<table id="tblAssSubjSave" runat="server">
<tr>
<td>
<asp:Button runat="server" ID="btnSaveAssessment" Text="Save Slot"
ValidationGroup="vgAssessments" OnClick="btnSaveAssessment_Click" />
<asp:Button runat="server" ID="btnCancelAssessment" Text="Reset"
CausesValidation="false" OnClick="btnCancelAssessment_Click" />
</td>
</tr>
</table>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="btnSaveAssessment" />
</Triggers>
</asp:UpdatePanel>
You should bind your listbox inside the !IsPostback event.
if (!IsPostBack)
{
//bind your listbox here
}
What happen in your case, Whenever you click on button, firstly it will call the page load event and it will re-bind your listbox source therefore your selected values will be lost.
You can store the value in a hidden field and then repopulate the listbox after the page postback.

"<!" character combination in ASP.NET textbox prevents postback

So this is very strange, and I haven't been able to find anything about it while searching.
I have an ASP.NET webforms app, and I am using the AJAX Control Toolkit's Modal Popup extender. Inside of this popup, I have a multi line textbox and some buttons. Both are ASP control. I have found that after entering the character combination "
Here is a picture of the dialog:
The dialog that won't work
And here is the markup for it:
<div id="notes" style="display: none">
<asp:UpdatePanel id="upnlNotesHeader" runat="server" class="logHeader">
<ContentTemplate>
<asp:Label ID="lblNotes" runat="server"></asp:Label>
</ContentTemplate>
</asp:UpdatePanel>
<div class="logBody" style="height:200px">
<asp:UpdatePanel ID="upnlNotes" runat="server">
<ContentTemplate>
<asp:HiddenField ID="hdnNotesJswo" runat="server" />
<asp:TextBox ID="txtNotes" runat="server" TextMode="MultiLine" MaxLength="4000" Font-Names="Arial" Rows="12" Columns="62" style="margin: 5px 0 0 5px"></asp:TextBox>
</ContentTemplate>
</asp:UpdatePanel>
</div>
<div class="logBtns">
<asp:UpdatePanel runat="server">
<ContentTemplate>
<asp:Button ID="btnSaveNotes" runat="server" Text="Save" CssClass="logBtn" OnClick="btnSaveNotes_Click" />
<asp:Button ID="btnCancelNotes" runat="server" Text="Cancel" CssClass="logBtn" OnClick="btnCancelNotes_Click" />
</ContentTemplate>
</asp:UpdatePanel>
</div>
</div>
Does anyone know why this is happening?
The problem comes from the request validation performed by ASP.NET when submitting the page. You can turn it off at the page level like this:
<%# Page ValidateRequest="false" ... %>
An alternative, if you want to keep the validation, is to encode the content of the fields before submitting the form to the server, and decode it in code-behind.

Button postback getting error

I have a updatepanel with a listview inside. This panel refreshes with an interval of 10 seconds, and listview source is updated and rebinded. My listview have some imagebuttons, and here comes the problem. When I click any of the listview buttons, I get a error:
"Invalid postback or callback argument." error.
I'm trying everything that I see on my serches, and no, I'll not set validation to false.
Here's a simplified template of my list.
<asp:UpdatePanel runat="server" ID="pnlRegistro" ClientIDMode="Static" OnLoad="pnlRegistro_Load">
<ContentTemplate>
<asp:ListView runat="server" ID="lvRegistro" OnPreRender="lvRegistro_PreRender" >
<LayoutTemplate>
<!-- Unread notification count -->
<span runat="server" id="spanRegistroCount" class="mws-dropdown-notif">
<asp:Label ID="lblRegistroCount" runat="server" Text="0"></asp:Label>
</span>
</LayoutTemplate>
<ItemTemplate>
<li class="<%# Convert.ToInt32(Eval("RegistroHorarioId"))==0?"read":"unread"%>">
<a>
<div style="width: 80%; float: left;">
<span class="message" <%#Eval("SpanColor")%>>
<%#Eval("Status")%>
</span>
</div>
<div style="float: right">
<asp:ImageButton runat="server" ID="btnRegistro" OnClick="btnRegistro_Click"/>
</div>
</a>
</li>
</ItemTemplate>
</asp:ListView>
</ContentTemplate>
</asp:UpdatePanel>
What can I do to fix this error and fire "btnRegistro_Click" event?
Update Panel is used for Updating Partial Page instead of doing full postback.
So,you have to add PostBackTrigger sync or async whatever you want because you are using update panel and for update panel events are defined in triggers to avoid full postback, so most probably you want asnc postback trigger.
add trigger for button event after content template end tag (</ContentTemplate>):
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="btnRegistro" EventName="Click" />
</Triggers>
</asp:UpdatePanel>
you should also read Understanding ASP.NET AJAX UpdatePanel Triggers

Update panel in master page and asp fileupload in child page

i'm facing a problem, currently i'm having a update panel in my master page and in one of my child page i'm having a asp fileupload control.
My update Panel in master p[age:
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:updateprogress associatedupdatepanelid="UpdatePanel1"
id="updateProgress" runat="server">
<progresstemplate>
<div id="processMessage" style=" background-image:url('../../Styles/ajax-loader3.gif'); width:100px; height:100px; background-repeat:no-repeat; background-position:center;">
</div>
</progresstemplate>
</asp:updateprogress>
<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
<ContentTemplate>
..
</ContentTemplate>
</asp:UpdatePanel>
</form>
My Child page which needs a fileupload:
<div id="Annoucments" class="ContentDIV">
<h2 class="Tabheader">Annoucments</h2>
<p class="tabdescription">Here you will be able to upload announcements and pictures to be displayed in the login page, below is the current announcement click on update to save the changes that you have made.</p>
<table width = "100%">
<tr>
<td class="Tablabel">Annoucment title:</td> <td class="tableInput" align="left"><asp:TextBox ID="Announcement_TB" runat="server" CssClass="textboxTabs"></asp:TextBox></td>
<td class="Tablabel">Picture/Poster:</td> <td class="tableInput" align="left"><asp:FileUpload ID="Announcement_PIC" runat="server" CssClass="textboxTabsFiles"/></td>
</tr>
<tr>
<td class="Tablabel">Description:</td> <td class="tableInput" align="left"><asp:TextBox ID="Announcement_Desc" CssClass="textboxTabs" runat="server" Rows="3" TextMode="MultiLine"></asp:TextBox></td>
</tr>
<tr><td colspan="4" style="height:10px" id ="BLANK">
<asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
</td></tr>
<tr>
<td colspan="2" align="right"><input type="button" id="Announcement_Update" runat="server" value="Update" class="TabButton" onserverclick="ANNOUNCEMENT_UPDATE_Click" style=" font-size:smaller"/></td><td colspan="2"> <input type="button" ID="ANNOUNCEMENT_Cancel" runat="server" value="Cancel" class="TabButton" style=" font-size:smaller"/></td>
</tr>
</table>
</div>
*When i click the button Announcement_Update backend codes will be triggered to get my filename, the file name returned will always be "" found out while debugging.*
Put this code in child page, to pass PostBackTrigger for file upload.
protected void Page_Load(object sender, EventArgs e)
{
UpdatePanel updatePanel = Page.Master.FindControl("UpdatePanel1") as UpdatePanel;
UpdatePanelControlTrigger trigger = new PostBackTrigger();
trigger.ControlID = Announcement_Update.UniqueID;
updatePanel.Triggers.Add(trigger);
}
enjoy coding :)
You can't get filename inside that UpdatePanel
either remove that UpdatePanel from your code or use Asynchronous File Uploader,
Alternatively you could use Ajax File Uploading techniques this is a little tricky though.
Asp UpdatePanel not work inside a update panel duw to postback issue.
You can add trigger with the button assosiated with uploader like
<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<asp:Button ID="Button1" runat="server" Text="Click" />
</ContentTemplate>
<Triggers>
<asp:PostBackTrigger ControlID="Button1" />
</Triggers>
</asp:UpdatePanel>
It works for me if you add the Trigger, but also make sure to edit to form tag to include:
<form runat="server" enctype="multipart/form-data">

ajax progress bar not working?

I am trying to present a ajax progress bar when a delete button is clicked. This delete button will do things and will take time to process.. The delete button is within a repeater. The code is below:
<asp:UpdatePanel runat="server" ID="upDatePanel" UpdateMode="Conditional">
<ContentTemplate>
<asp:UpdateProgress runat="server" ID="UpdateProgress1" DynamicLayout="false" AssociatedUpdatePanelID="upDatePanel">
<ProgressTemplate>
<img id="Img1" runat="Server" src="~/Images/ajax-loader.gif" height="50" width="50" alt=""/>
</ProgressTemplate>
</asp:UpdateProgress>
<asp:Repeater ID="rptWork" runat="server" OnItemDataBound="rptWork_ItemDataBound">
<ItemTemplate>
<tr>
<td>
<asp:LinkButton ID="btnDelete" OnClick="btnDelete_Click" Text="Delete" runat="server" />
</td>
</tr>
</ItemTemplate>
<AlternatingItemTemplate>
<tr>
<td>
<asp:LinkButton ID="btnDelete" OnClick="btnDelete_Click" Text="Delete" runat="server"/>
</td>
</tr>
</AlternatingItemTemplate>
<FooterTemplate>
</table>
</FooterTemplate>
</asp:Repeater>
</ContentTemplate>
</asp:UpdatePanel>
I have put in a Thread.Sleep behind the delete button so when user clicks the progress bar appears however the process time takes abit longer. How can i make the progress bar stay on screen until the process is fully complete?
Try changing the UpdateMode="Always" to see if your getting page updates.
If you use conditional you will have to call Update yourself on the panel (not sure if your doing this??)

Categories