Develop Reference

Panel not displayed in UpdatePanel

<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

TextBox OnTextChanged / PostBack not working

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.

ASP.NET, Multiple Val Summary not working; required field val not firing

I have a repeater with editable rows on the aspx page. The row has a textbox and a required field validator associated to it. On 'save' button click on that row, the required field valiator fires, It is tied to a validationsummary at the top of the page.
Now I have this panel below the repeater with a text box and a save button. This panel is 'opened' using the jquery show method on the click on a linkbutton at the top of this panel.
The required field validator is not firing for this texbox. I have a different validation summary for this textbox; as I need to trigger the validations on click on its save button only.
So I have the code like this,
<asp:ValidationSummary ID="validationSummary" ValidationGroup="ValidationGroup1" EnableClientScript="true" runat="server" />
<asp:ValidationSummary ID="validationSummary1" ValidationGroup="ValidationGroup2" EnableClientScript="true" runat="server" />
<asp:Repeater ID="Teams" runat="server" OnItemCommand="ItemCommand" OnItemDataBound="ItemDataBound">
<HeaderTemplate>
<table >
<tr>
<th>
<asp:Label ID="lbTeamNameHeader" runat="server" Text="TeamNameHeader"></asp:Label></th>
<th></th> </tr>
</HeaderTemplate>
<ItemTemplate>
<tr>
<td>
<asp:TextBox ID="txtTeamName" runat="server" Text='<%# DataBinder.Eval(Container.DataItem, "txtTeamName")%>' />
<asp:RequiredFieldValidator ID="reqdFieldValTeamName" ErrorMessage="Field cannot be blank" ValidationGroup="ValidationGroup1" runat="server" Display="None" ControlToValidate="txtTeamName"></asp:RequiredFieldValidator>
<asp:RegularExpressionValidator ID="regularExprTeamName" ErrorMessage="Invalid input for the team name" ValidationGroup="ValidationGroup1" Display="None" ControlToValidate="txtTeamName" runat="server" ValidationExpression="^[a-zA-Z0-9]+$"></asp:RegularExpressionValidator>
</td>
<td>
<asp:Panel ID="panelSave" runat="server" Visible="false">
<asp:LinkButton ID="linkbuttonSave" runat="server" CommandName="Save" ValidationGroup="ValidationGroup1" Text="SAVE" />
<asp:LinkButton ID="linkbuttonCancel" runat="server" CommandName="Cancel" Text="CANCEL" />
</asp:Panel>
</td>
</tr>
</ItemTemplate>
<FooterTemplate></table></FooterTemplate>
</asp:Repeater>
<asp:LinkButton ID="linkbuttonAddTeam" runat="server" Text="Add New Team" />
<div id="AddPanelDiv" style="display:none;">
<asp:TextBox ID="txtAddTeam" runat="server" />
<asp:RequiredFieldValidator ID="reqdFieldValAddTeam" ErrorMessage="Field cannot be blank" ValidationGroup="ValidationGroup2" runat="server" Display="None" ControlToValidate="txtAddTeam"></asp:RequiredFieldValidator>
<asp:RegularExpressionValidator ID="regularExprValAddTeam" ErrorMessage="Invalid format" ValidationGroup="ValidationGroup2" Display="None" ControlToValidate="txtAddTeam" runat="server" ValidationExpression="^[a-zA-Z0-9]+$"></asp:RegularExpressionValidator>
<asp:LinkButton ID="linkbuttonCancel" runat="server" Text="CANCEL"></asp:LinkButton>
<asp:LinkButton ID="linkbuttonSaveNewTeam" runat="server" OnClick="linkbuttonSaveNewTeam_OnClick" Text="SAVE" CausesValidation="true" />
</div>
Why on earth the validators for the bottom panel fire? On click of that save button, it straightaway goes to the page method onclick.
If I remove the validation group and click on the save in the repeater, it fires! But thats not what I want..

You are missing ValidationGroup="ValidationGroup2" on your second button it looks like.
<asp:LinkButton ID="linkbuttonSaveNewTeam" runat="server" OnClick="linkbuttonSaveNewTeam_OnClick"
Text="SAVE" CausesValidation="true" ValidationGroup="ValidationGroup2" />

user control's dropdown causing full postback inside updatepanel

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.

Getting Failed to load viewstate error

First off, I am not dynamically creating any controls. This is the order I take to produce the error:
I have a listview on the page, when I click the edit link under the listview, I display a panel which is hidden by default. The panel has a few buttons on it along with some listboxes. When I click an item in the listbox or click one of the buttons, I get the following error:
Failed to load viewstate. The control tree into which viewstate is being loaded must match the control tree that was used to save viewstate during the previous request. For example, when adding controls dynamically, the controls added during a post-back must match the type and position of the controls added during the initial request.
Again, I am not creating anything dynamically, I am just hiding the panel with the controls by default and then displaying them, so I am not sure why I am getting this error.
Here is some code:
PAGE LOAD
protected void Page_Load(object sender, EventArgs e)
{
if (!Page.IsPostBack)
{
Session["Albums"] = null;
Albums = AlbumCollection.GetAlbums(Common.GetUserName(),
ddlAlbumType.SelectedIndex);
lvwAlbums.DataSource = Albums;
lvwAlbums.DataBind();
}
}
When I click the edit link, this is the code that runs:
protected void lvwAlbums_RowEditing(object sender, ListViewEditEventArgs e)
{
this.AlbumId = int.Parse(
this.lvwAlbums.DataKeys[e.NewEditIndex].Values["AlbumId"].ToString());
this.AlbumName=
this.lvwAlbums.DataKeys[e.NewEditIndex].Values["AlbumName"].ToString();
Album album = new Album(this.AlbumId);
ViewState["AlbumId"] = this.AlbumId;
ViewState["AlbumName"] = this.AlbumName;
pnlAlbum.Visible = true; // This panel holds the controls
btnEditAlbum.Visible = true;
btnCancel.Visible = true;
EditAlbum(this.AlbumId);
this.lvwAlbums.EditIndex = e.NewEditIndex;
AlbumCollection.GetAlbums(Common.GetUserName(),ddlAlbumType.SelectedIndex);
}
If I click the cancel button, I get the error, but it also happens if click another button on the panel such as Add/Remove... Here is the code for the Cancel button:
pnlAlbum.Visible = false;
this.lvwAlbums.EditIndex = -1;
AlbumCollection.GetAlbums(Common.GetUserName(), ddlAlbumType.SelectedIndex);
Here is the aspx/html for the ListView:
<asp:ListView ID="lvwAlbums"
runat="server"
GroupItemCount="5"
DataKeyNames="AlbumId,AlbumName"
OnItemEditing="lvwAlbums_RowEditing"
OnItemCommand="lvwAlbums_ItemCommand"
OnItemDeleting="lvwAlbums_RowDeleting"
OnSelectedIndexChanging="lvwAlbums_SelectedIndexChanging"
OnPagePropertiesChanging="lvwAlbums_PagePropertiesChanging">
<EditItemTemplate>
<td>
<div>
<asp:TextBox ID="txtAlbumName" runat="server"
Text='<%# Eval("AlbumName").ToString().Trim() %>' />
<asp:LinkButton ID="lnkView" runat="server" Text="View" CommandName="View"
CommandArgument='<%# Eval("AlbumId") %>'>
</asp:LinkButton>
|
<asp:LinkButton ID="lnkEdit" runat="server" Text="Edit" CommandName="Edit"
CommandArgument='<%# Eval("AlbumId") %>'>
</asp:LinkButton>
|
<asp:LinkButton ID="lnkDelete" runat="server" Text="Delete" CommandName="Delete"
CommandArgument='<%# Eval("AlbumId") %>'>
</asp:LinkButton>
<br />
<span>Songs:
<%# Eval("total") %></span>
</div>
</td>
</EditItemTemplate>
<LayoutTemplate>
<asp:DataPager runat="server" ID="ItemDataPager" PageSize="20"
PagedControlID="lvwAlbums">
<Fields>
<asp:NumericPagerField ButtonType="Link" NumericButtonCssClass="pager" />
</Fields>
</asp:DataPager>
<table>
<tr>
<td>
<table>
<asp:PlaceHolder runat="server" ID="groupPlaceHolder"></asp:PlaceHolder>
</table>
</td>
</tr>
</table>
</LayoutTemplate>
<GroupTemplate>
<tr>
<asp:PlaceHolder runat="server" ID="itemPlaceHolder"></asp:PlaceHolder>
</tr>
</GroupTemplate>
<ItemTemplate>
<td>
<asp:Literal ID="litAlbumName" runat="server"
Text='<%# Eval("AlbumName").ToString().Trim() %>' />
<br />
<asp:LinkButton ID="lnkView" runat="server" Text="View" CommandName="View"
CommandArgument='<%# Eval("AlbumId") %>'>
</asp:LinkButton>
|
<asp:LinkButton ID="lnkEdit" runat="server" Text="Edit" CommandName="Edit"
CommandArgument='<%# Eval("AlbumId") %>'>
</asp:LinkButton>
|
<asp:LinkButton ID="lnkDelete" runat="server" Text="Delete" CommandName="Delete"
CommandArgument='<%# Eval("AlbumId") %>'>
</asp:LinkButton>
<br />
<span>Songs:
<%# Eval("total") %></span>
</td>
</ItemTemplate>
</asp:ListView>
Here is the markup for the Panel:
<asp:Panel ID="pnlAlbum" runat="server" Visible="false">
<asp:ListBox ID="lstAvailableSongs" runat="server" SelectionMode="Multiple">
</asp:ListBox>
<asp:Button ID="btnAddAll" runat="server" Text="Add All" OnClick="btnAddAll_Click" />
<asp:Button ID="btnAdd" runat="server" Text="Add" OnClick="btnAdd_Click" />
<asp:Button ID="btnRemove" runat="server" Text="Remove" OnClick="btnRemove_Click" />
<asp:Button ID="btnRemoveAll" runat="server"
Text="Remove All"OnClick="btnRemoveAll_Click" />
<asp:ListBox ID="lstSelectedSongs" runat="server" SelectionMode="Multiple">
</asp:ListBox>
<asp:Button ID="btnCancel" runat="server" Text="Cancel" OnClick="btnCancel_Click" />
<asp:Button ID="btnEditAlbum" runat="server"Text="Save"
ValidationGroup="CreateAlbum" OnClick="btnEditAlbum_Click" />
<asp:Button ID="btnSaveAs" runat="server" Text="Save As" ValidationGroup="CreateAlbum"
OnClick="btnSaveAs_Click" />
</asp:Panel>
Here is some extra info:
I put an update panel around one of the listboxes in the panel and when I clicked the edit link under a listview item, I received the following error:
Microsoft JScript runtime error: Sys.InvalidOperationException: Could not find UpdatePanel with ID 'ctl00_ctl00_InnerContent_MainContent_UpdatePanel4'. If it is being updated dynamically then it must be inside another UpdatePanel.
Putting an UpdatePanel around the whole asp.net panel resolved the issue above, but I still get the Failed to load viewstate error when clicking on Cancel or Add, etc...

First off, you probably need to rebind the ListView after setting the EditIndex. (honestly, I haven't used ListView at all, but this is how the other repeater controls work) What does "EditAlbum()" do?
Your code is a little odd... why do you have the same controls in your EditItemTemplate as in the ItemTemplate? Ie, the Edit button should only be in the ItemTemplate... Then EditItemTemplate should have a Save or Cancel button.
Bottom line... your control tree is different on LoadViewState than it is when SaveViewState was called. One thing you can do is override these methods and then put a breakpoint there to manually look at the Controls collection in the debugger. You will probably see that the controls inside the ListView are different. But try my first suggestion before you do this.

Question for you:
in your Page_Load you have
Albums = AlbumCollection.GetAlbums(Common.GetUserName(), ddlAlbumType.SelectedIndex);
but in lvwAlbums_RowEditing(..) and in btnCancel_Click(...) you have
AlbumCollection.GetAlbums(Common.GetUserName(), ddlAlbumType.SelectedIndex);
shouldn't these be (Albums = ...)
Albums = AlbumCollection.GetAlbums(Common.GetUserName(), ddlAlbumType.SelectedIndex);