I am working on asp.net application and I have an update panel like this:
<asp:UpdatePanel ID="upCheckout" runat="server">
<ContentTemplate>
<!-- BillingAddress -->
<div runat="server" id="pnlBillingAddress" class="checkoutstep">
<asp:Panel runat="server" ID="pnlBillingAddressContent" class="stepcontent">
<nopCommerce:CheckoutBillingAddress ID="ctrlCheckoutBillingAddress" runat="server"
OnePageCheckout="true" OnCheckoutStepChanged="ctrlCheckoutBillingAddress_CheckoutStepChanged" />
<asp:CheckBox ID="chkShippingSameAsBilling" runat="server" Text=" Ship to same address"
AutoPostBack="true" Checked="true" onclick="ShowShippingAddress();" /><br />
</asp:Panel>
</div>
<!-- ShippingAddress -->
<div runat="server" id="pnlShippingAddress" class="checkoutstep">
<asp:Panel runat="server" ID="pnlShippingAddressContent" class="stepcontent">
<nopCommerce:CheckoutShippingAddress ID="ctrlCheckoutShippingAddress" runat="server"
OnePageCheckout="true" OnCheckoutStepChanged="ctrlCheckoutShippingAddress_CheckoutStepChanged" />
</asp:Panel>
</div>
</ContentTemplate>
</asp:UpdatePanel>
where billing address is a user control. In billing address control, There is a dropdownlost. like this:
<asp:DropDownList ID="drpBillingAddresses" ClientIDMode="Static" runat="server" AutoPostBack="True" OnSelectedIndexChanged="drpBillingAddresses_SelectedIndexChanged">
</asp:DropDownList>
but when I change dropdown selection, I get full post back instead of partial postback. why I am getting full postback ?
Register the OnSelectedIndexChanged event as asynchronous by setting Triggers property of UpdatePanel.
Related
<form runat="server" id="from1">
<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<script src='https://www.google.com/recaptcha/api.js'></script>
<asp:Panel runat="server" ID="pnlSiteQuestions">
>>>>> CONTROLS removed for brevity <<<<<
<asp:Button ID="btnContinue" runat="server" Text="Continue" OnClick="btnContinue_Click" ValidationGroup="Questions" />
</asp:Panel>
</ContentTemplate>
</asp:UpdatePanel>
<asp:Panel ID="pnlNotRequired" runat="server" Visible="false">
Sorry you do not qualify.
</asp:Panel>
<asp:Panel runat="server" ID="pnlAdditionalDetails" Visible="false">
<asp:ValidationSummary runat="server" ID="ValidationSummary1" />
Name
<asp:RequiredFieldValidator runat="server" ID="ValidatorName" ControlToValidate="ContactFormNameTextBox" ErrorMessage="Name is required" CssClass="ErrorClass">Required</asp:RequiredFieldValidator>
<asp:TextBox runat="server" ID="txtName" />
<div class="g-recaptcha" data-sitekey="ABC123"></div>
<asp:Button runat="server" ID="button1" Text="Confirm" OnClick="button1_Click" />
</asp:Panel>
</form>
I have the above form and decided to add an update panel. When a user clicks Continue, it goes to a database and determines if the user qualifies. If not pnlNotRequired message is displayed otherwise pnlAdditionalDetails is displayed.
Everything is/was working until i added the update panel. So removing the UP has everything working.
I tried adding a trigger but i didnt fully understand how it should be configured as i dont completely understand why this is occurring?
No Javascript errors listed either. Anyway to overcome this issue?
Update panel should cover all panels. Add property to update panel "UpdateMode='Conditional'" than add trigger block
Below is the code.
Everything else is working fine. Just when the user clicks btnWhishlist (if user not logged-in) ModalPopupExtender displays for login. On popup whether Cancel or Login is clicked, even if the user gets logged in, the btnWishlist button disappears.
When the page is reloaded the button appears again. Looks like UseSubmitBehavior="false" is creating the problem. The page do not reload but only the button disappears, everything else remains same.
Tried jquery to show the panel/div that contains the button. No Luck.
<ContentTemplate >
<asp:ListView ID="usrListShowImages" runat="server" OnItemCommand="usrListShowImages_ItemCommand" OnItemCreated="usrListShowImages_ItemCreated" >
<LayoutTemplate>
some layout
</LayoutTemplate>
<ItemTemplate>
<tr>
<asp:UpdatePanel runat="server" UpdateMode="Conditional" ChildrenAsTriggers="false" ID="up_inlv">
<ContentTemplate>
<div id="divWishlist" class="wishlist" runat="server">
<div class="<%--growuser--%>picUserShow">
<asp:ImageButton ID="btnImages" ImageUrl='<%# ".." + Eval("ItemsPicUrl") %>' runat="server" CssClass="growuser" CommandName="btnImages" CommandArgument='<%# Eval("ID") %>' />
<asp:Panel class="bottomDiv" runat="server" id="btmDiv"> <%-- HAVE USER SIGNIN, CHECK FROM DB THAT THIS ITEM WAS ADDED TO WISHLIST OR NOT AND THEN ALOT THE BUTTON TEXT ACCORDINGLY --%>
<asp:UpdatePanel runat="server">
<ContentTemplate>
<asp:Button ID="btnWhishlist" Text='<%# Eval("colbtnwishlist") %>' runat="server" CssClass="wishlistButton" CommandName="btnWhishlist" CommandArgument='<%# Eval("ID") %>' UseSubmitBehavior="false" EnableViewState="true" />
</ContentTemplate>
</asp:UpdatePanel>
</asp:Panel>
<div class="bottomDivCart">
<asp:UpdatePanel runat="server">
<ContentTemplate>
<asp:Button ID="btnCart" Text="Cart" runat="server" CssClass="CartButton" CommandName="btnCart" UseSubmitBehavior="false" CommandArgument='<%# Eval("ID") %>' EnableViewState="true" />
</ContentTemplate>
</asp:UpdatePanel>
</div>
<div class="caption">
<%# Eval("captionforpage") %>
</div>
</div>
<div class="priceTag">Price Rs.<%# Eval("priceofarticle") %></div>
</div>
</div>
</ContentTemplate>
</asp:UpdatePanel>
</tr>
</ItemTemplate>
There are no errors so far. The wish button should show up without having a page reload, the same way the other artifacts are showing up
I have an AJAX tab container that contains two tab panels.
The problem when I fire an event on the second tab it reloads the first tab.
Any help? Suggestions? below is a sample of the aspx code
<AJAX:TabContainer runat="server" ID="tcMain" ActiveTabIndex="0">
<AJAX:TabPanel runat="server" ID="tpTab1" TabIndex="1">
<HeaderTemplate>
Tab1
</HeaderTemplate>
<ContentTemplate>
<div runat="server" id="div1">
<asp:UpdatePanel ID="upTab1" runat="server">
<ContentTemplate>
//entry and events
</ContentTemplate>
</asp:UpdatePanel>
</div>
</ContentTemplate>
</AJAX:TabPanel>
<AJAX:TabPanel runat="server" ID="tpTab2" TabIndex="2">
<HeaderTemplate>
Tab2
</HeaderTemplate>
<ContentTemplate>
<div runat="server" id="div2">
<asp:UpdatePanel ID="upTab2" runat="server">
<ContentTemplate>
// entry and events
</ContentTemplate>
</asp:UpdatePanel>
</div>
</ContentTemplate>
</AJAX:TabPanel>
</AJAX:TabContainer>
Most likely this is because of page post-back happening.you can manage the data using ViewState property this link may solve your issue HElP
.
My problem is that I can't seem to get my textbox to fire the OnTextChanged event. I also checked and it doesn't seem like it is doing an autopostback despite the fact that it is set to true.
Basically, I am trying to validate the text in the textbox and either enable or disable a button based on the validation status.
Here's my code:
<asp:Panel ID="panelAccessControl" runat="server" Visible="false">
<asp:Panel ID="panelAddMileageRate" runat="server" BorderWidth="2" >
<h2>Add Mileage Rate</h2>
<asp:ScriptManager ID="scriptManagerMileageRate" runat="server" />
<asp:UpdatePanel ID="updatePanelAddMileageRate" runat="server">
<ContentTemplate>
<p>
Purpose:
<asp:DropDownList ID="ddlAddPurpose" runat="server"
AutoPostBack="true" Width="200px"></asp:DropDownList>
<br />
Country:
<asp:DropDownList ID="ddlAddCountry" runat="server"
AutoPostBack="true" Width="200px" >
</asp:DropDownList>
<br />
Effective Date:
<asp:Calendar ID="calAddEffectiveDate" runat="server">
</asp:Calendar>
<br />
Mileage Rate:
<asp:TextBox ID="txtAddMileageRate" runat="server"
AutoPostBack="true" Width="200px"
CausesValidation="true"
ontextchanged="txtAddMileageRate_TextChanged">
</asp:TextBox>
<asp:RegularExpressionValidator
ID="validatorAddMileageRate"
ControlToValidate="txtAddMileageRate" runat="server"
SetFocusOnError="true"
ErrorMessage="Only Numbers allowed"
ValidationExpression="^\d{1,20}(\.\d{0,4})?$">
</asp:RegularExpressionValidator>
</p>
</ContentTemplate>
</asp:UpdatePanel>
<p>
<asp:Button ID="buttonAddSecurityGroup" runat="server"
Text="Submit" onclick="buttonAddSecurityGroup_Click" />
</p>
</asp:Panel>
<asp:Label ID="lblStatus" runat="server" Text=""></asp:Label>
</asp:Panel>
The text box in question is txtAddMileageRate.
Set the EventName property for your txtAddMileageRate AsyncPostBackTrigger to TextChanged.
Add following codes inside your update panel and outside of ContentTemplate
<Triggers>
<asp:AsyncPostBackTrigger ControlID="txtAddMileageRate"
EventName="TextChanged" />
</Triggers>
Other sugguestion:
Have you tried looking at the AutoComplete (http://www.asp.net/ajax/ajaxcontroltoolkit/samples/autocomplete/autocomplete) control that is part of the AjaxControlToolKit? Its behaves the same way you want your solution to behave.
I am using an Update Panel within a Repeater. I need for the Update Panel to contain validation. The validation is in place but is getting fired for each Panel. I need it to only be applied to the Panel being accessed.
<asp:Repeater ID="rptComments"
runat="server"
OnItemDataBound="rptComments_OnItemDataBound"
OnItemCommand="rptComments_OnItemCommand">
<HeaderTemplate>
<ul class="comments">
</HeaderTemplate>
<ItemTemplate>
<li>
<asp:UpdatePanel ID="updatePanelReply" runat="server" UpdateMode="Conditional" >
<ContentTemplate>
<asp:PlaceHolder ID="plcForm" runat="server">
<div class="errors">
<asp:ValidationSummary ID="nestedCommentsValidation" ValidationGroup="nestedSubmit" runat="server" cssClass="validation" ForeColor="Red" />
</div>
<label>Name<sup>*</sup></label>
<asp:TextBox ID="tbReplyName" runat="server" cssClass="styledInput"></asp:TextBox><br />
<asp:RequiredFieldValidator ID="rfv_tbReplyName"
runat="server"
Display="None"
ControlToValidate="tbReplyName"
InitialValue=""
ErrorMessage="Please enter your name."
ValidationGroup="nestedSubmit">
</asp:RequiredFieldValidator>
<asp:Button ID="btnButton" runat="server" Text="Button" CssClass="submit-button" CommandName="SubmitReply" ValidationGroup="nestedSubmit" />
</asp:PlaceHolder>
</ContentTemplate>
</asp:UpdatePanel>
</li>
</ItemTemplate>
<FooterTemplate>
</ul>
</FooterTemplate>
</asp:Repeater>
Are you using different validation groups in your different panels? The whole point of the validation group is that the validators will only validate the controls that are in the same group.
I ended up taking out the validation group and handling it in the OnItemCommand event. There may be a slicker way of doing it, but this worked for me.
if (String.IsNullOrEmpty(tbReplyName.Text.ToString().Trim()))
strValidationMessage = "<li>Please enter your name.</li>";
Literal ltrErrorMessage = (Literal)e.Item.FindControl("ltrErrorMessage");
ltrErrorMessage.Text = strValidationMessage;