I am using a modal popup that contains a dropdown box. When the dropdown is changed I'm trying to retrieve data and assign it labels also within the modal. I observe the label values being set in the debugger but they do not show in the modal.
Modal/Panel Code:
<asp:Panel ID="pnlUpdate" runat="server" CssClass="modalPopup">
<div>
<asp:UpdatePanel runat="server" ID="upSubnetUpdate" UpdateMode="Conditional">
<ContentTemplate>
<asp:Label runat="server" ID="pnlLblSubnet" CssClass="searchLabel">Subnet:</asp:Label>
<asp:DropDownList runat="server" ID="ddlSubnet" OnSelectedIndexChanged="ddlSubnet_SelectedIndexChanged" AutoPostBack="true"></asp:DropDownList><br />
</ContentTemplate>
</asp:UpdatePanel>
</div>
<div>
<asp:Label runat="server" ID="lblIPStartUpdate"></asp:Label>
<asp:Label runat="server" ID="lblIPEndUpdate"></asp:Label>
<asp:Label runat="server" ID="lblGatewayUpdate"></asp:Label>
<asp:Label runat="server" ID="lblSubnetMaskUpdate"></asp:Label>
</div>
</asp:Panel>
Dropdown Code
protected void ddlSubnet_SelectedIndexChanged(object sender, EventArgs e)
{
SubnetInfo si = GetSubnetInfo(ddlSubnet.SelectedItem.Text);
lblIPStartUpdate.Text = si.IP_Start;
lblIPEndUpdate.Text = si.IP_End;
lblGatewayUpdate.Text = si.Gateway;
lblSubnetMaskUpdate.Text = si.Subnet_Mask;
}
I'm not sure if this is a page lifecycle issue or a limitation of the modal popup.
Thanks for the help!
You need to put the DropDown and the labels in an UpdatePanel. The dropdown is in an UpdatePanel, but it cannot update the labels if they're not in an UpdatePanel too.
Related
ASP.NET radio button is not visible in my page. I am using it inside ASP.NET ListView. I tried putting the radio button inside ASP.NET update panel content template as well. Please tell me what has gone wrong?
<asp:UpdatePanel runat="server">
<ContentTemplate>
<asp:ListView ID="FraudCheckList_listView" runat="server">
<ItemTemplate>
<p class="fraud-step-title"><%#Eval("question")%></p>
<div class="row">
<asp:RadioButton
runat="server"
class="radio-inline col"
GroupName="govt"
Text="Low Risk"
></asp:RadioButton>
<asp:RadioButton
runat="server"
GroupName='govt'
Text="Medium Risk"
></asp:RadioButton>
<asp:RadioButton
runat="server"
GroupName='govt'
Text="High Risk"
></asp:RadioButton>
</div>
</ItemTemplate>
</asp:ListView>
</ContentTemplate>
</asp:UpdatePanel>
Since you haven't shared how your code looks like, i am just assuming certain things. Just see if you have done this or not.
void Button_Click(object sender, System.EventArgs e){RadioButton.Visible=false;}
If incase its true or something your radiobutton will not be visible. In your case it must be hidden. So, make the variable of visible as **false ** So you can just change your code to this and try it out.
This you have to do it in your main code. not in your html code.
Thank You!
I'm facing a problem that doesn't seems to have a solution.
I have a MasterPage with a ScriptManager as you can see right below:
<asp:ScriptManager ID="ScriptManager1" runat="server" EnablePartialRendering="true" >
<Scripts><asp:ScriptReference Path="js/jquery-1.11.2.min.js" /></Scripts>
<Scripts><asp:ScriptReference Path="js/jquery-ui.min.js" /></Scripts>
<Scripts><asp:ScriptReference Path="js/jquery.bxslider.min.js" /></Scripts>
<Scripts><asp:ScriptReference Path="js/bootstrap.js" /></Scripts>
</asp:ScriptManager>
And, in one of my Content Pages i have an UpdatePanel:
<div id="cad_cpf" class="cad_cpf">
<asp:Label runat="server" ID="lblCpf" CssClass="lblCpf" Text="* CPF:" Width="200px"></asp:Label>
<asp:TextBox runat="server" ID="txtCpf" CssClass="txtCpf" MaxLength="14" CausesValidation="True" AutoPostBack="true" OnTextChanged="txtCpf_TextChanged"></asp:TextBox>
<asp:UpdatePanel ID="udpTeste" runat="server" ChildrenAsTriggers="false" UpdateMode="Conditional" style="display:inline-block;">
<ContentTemplate>
<asp:Panel runat="server" ID="pnlMensagemCpf" Visible="false"><asp:Label runat="server" Text="CPF já cadastrado. " CssClass="validacao" ID="lblMensagemCpf"></asp:Label><asp:HyperLink runat="server" ID="hplLogar" CssClass="validacao linkLogar" data-toggle="modal" data-target="#Login">Fazer login!</asp:HyperLink></asp:Panel>
</ContentTemplate>
</asp:UpdatePanel>
<asp:RequiredFieldValidator ID="rfvCpf" CssClass="validacao" runat="server" ControlToValidate="txtCpf" Display="Dynamic" ErrorMessage="Campo obrigatório" ValidationGroup="pessoa_fisica" EnableClientScript="False" SetFocusOnError="True"></asp:RequiredFieldValidator>
<asp:RegularExpressionValidator ID="regCPF" runat="server" ControlToValidate="txtCPF" CssClass="validacao" Display="Dynamic" EnableClientScript="False" ErrorMessage="Digite o CPF corretamente" SetFocusOnError="True" ValidationExpression="^\d{3}\.\d{3}\.\d{3}-\d{2}$" ValidationGroup="pessoa_fisica"></asp:RegularExpressionValidator>
</div>
All i want to do is to refresh the UpdatePanel so it can shows a Panel (with a Label and a Hyperlink) in the TextChanged event of a TextBox.
It seems like a have tried everything, but nothing works!
I tried to put the TextBox inside the ContentTemplate changing ChildrenAsTriggers to "true", but it didn't work.
I tried to use the Update() method in code behind, but it didn't work.
The funny fact is that if i set the TextBox as a PostBackTrigger it works perfectly (except for the fact that it refreshes the entire page), but when I set the TextBox as AsyncPostBackTrigger it does nothing.
Can anybody help me?
This is the only related post I've found so far on SO, not my exact issue, but close.
If I give focus to the first textbox on my page and then press TAB repeatedly until I reach the last control on my page the tab order works flawlessly, every control is given focus in the correct order.
BUT...
If I am actually filling out the form and I select a value in ANY dropdownlist, when I press TAB after selecting the value focus is given to the first textbox on my page rather than the next control after said dropdownlist.
I created a control that includes a label, a dropdownlist and an imagebutton because this list is used multiple times throughout my application. The control looks like this:
<%# Control Language="C#" AutoEventWireup="true" CodeBehind="OrganizationList.ascx.cs" Inherits="MyApp.Web.Controls.OrganizationList" %>
<%# Register src="UpdateProgress.ascx" tagname="UpdateProgress" tagprefix="uc1" %>
<%# Register src="Address.ascx" tagname="Address" tagprefix="uc2" %>
<asp:UpdatePanel ID="OrganizationUpdatePanel" runat="server" ChildrenAsTriggers="false" UpdateMode="Conditional">
<ContentTemplate>
<div style="margin: 0px;">
<div class="label"><asp:Label ID="Prompt" runat="server"></asp:Label>:</div>
<div class="field"><asp:DropDownList ID="Organizations" runat="server" Width="205" AutoPostBack="True" DataTextField="Name" DataValueField="Id"></asp:DropDownList> <asp:ImageButton id="AddOrganization" runat="server" ImageAlign="AbsMiddle" ToolTip="Add a new organization" onclick="AddOrganization_Click" /></div>
</div>
<asp:HiddenField ID="DummyButton" runat="server" />
<ajax:ModalPopupExtender ID="AddOrganizationModalPopupExtender" runat="server" BackgroundCssClass="modalBackground" CancelControlID="Cancel" DropShadow="true" PopupControlID="NewOrganization" RepositionMode="RepositionOnWindowResizeAndScroll" TargetControlID="DummyButton"></ajax:ModalPopupExtender>
<asp:Panel ID="NewOrganization" runat="server" CssClass="modalPopUp" Width="500">
<asp:Panel ID="OrganizationModalContent" runat="server" CssClass="modalContent" GroupingText="Add Organization" style="text-align: left; vertical-align: top;" Width="490">
<table border="0" cellpadding="2" cellspacing="0" width="100%">
<tr><td colspan="2"><asp:ValidationSummary ID="OrganizationValidationSummary" runat="server" CssClass="ValidationSummary" ValidationGroup="NewOrg" /></td></tr>
<tr><td class="label"><asp:RequiredFieldValidator ID="NameRequired" runat="server" ControlToValidate="Name" Display="Dynamic" ErrorMessage="Please provide the organization's name." SetFocusOnError="true" ValidationGroup="NewOrg">*</asp:RequiredFieldValidator>Organization Name:</td>
<td><asp:TextBox ID="Name" runat="server" MaxLength="100" Width="200"></asp:TextBox></td></tr>
<tr><td class="label"><asp:RequiredFieldValidator ID="PhoneRequired" runat="server" ControlToValidate="Phone" Display="Dynamic" ErrorMessage="Please provide the organization's phone number." SetFocusOnError="true" ValidationGroup="NewOrg">*</asp:RequiredFieldValidator>Phone:</td>
<td><ajax:MaskedEditExtender ID="PhoneMaskedEditExtender" runat="server" ClearTextOnInvalid="true" InputDirection="LeftToRight" Mask="(999)999-9999" MaskType="Number" MessageValidatorTip="true" PromptCharacter="_" TargetControlID="Phone"></ajax:MaskedEditExtender>
<asp:TextBox ID="Phone" runat="server" MaxLength="10" Width="200"></asp:TextBox></td></tr>
<tr><td class="label">Fax:<br />(optional)</td>
<td><ajax:MaskedEditExtender ID="FaxMaskedEditExtender" runat="server" ClearTextOnInvalid="true" InputDirection="LeftToRight" Mask="(999)999-9999" MaskType="Number" MessageValidatorTip="true" PromptCharacter="_" TargetControlID="Fax"></ajax:MaskedEditExtender>
<asp:TextBox ID="Fax" runat="server" MaxLength="10" Width="200"></asp:TextBox></td></tr>
<tr><td colspan="2"><uc2:Address ID="Address" runat="server" /></td></tr>
<tr><td colspan="2" style="text-align: right;"><asp:HiddenField ID="TypeOfList" runat="server" /><asp:Button ID="Submit" runat="server" CausesValidation="true" Text="Submit" onclick="Submit_Click" ValidationGroup="NewOrg" /><asp:Button ID="Cancel" runat="server" Text="Cancel" /></td></tr>
</table>
</asp:Panel>
</asp:Panel>
</ContentTemplate>
</asp:UpdatePanel>
<uc1:UpdateProgress ID="OrganizationUpdateProgress" runat="server" AssociatedUpdatePanelId="OrganizationUpdatePanel" />
Here's the TabIndex property on my control:
public short TabIndex
{
get { return Organizations.TabIndex; }
set { Organizations.TabIndex = value; AddOrganization.TabIndex = (short)(value + 1); }
}
Here's one of the references to the control on the parent page:
<uc3:OrganizationList ID="ReportedBy" runat="server" FieldLabel="Reported By" ListType="ReportedBy" TabIndex="105" />
Not sure what else you might want/need to see.
Browsers: IE8, IE9, IE10, FF 29.0.1
We've had some issues with IE versions above 9, so I added a HTTP Response Header to emulate IE9
My users claim that they primarily TAB to navigate in my app, so this is actually a higher priority bug than I expected. I don't know why the TabIndex is ignored once a value is selected.
Any ideas would be greatly appreciated.
UPDATE:
I do have 1 dropdownlist that is just an out-of-the-box dropdownlist, not a user control. That one works correctly. I can select a value in that list and then press TAB and the focus moves to the next control. So, can anyone help me figure out what is "wrong" with my user control that is causing this bug?
These two posts helped me figure out what I needed to do:
A postback via update panel resets TabIndex?
Accessing ToolKitScriptManager/ScriptManager from custom control
I added a SelectedIndexChanged event handler to my DropDownList in my control and set the focus back to the DropDownList. Here's the code:
protected void Organizations_SelectedIndexChanged(object sender, EventArgs e)
{
DropDownList ddl = (DropDownList)sender;
ScriptManager scriptMgr = ScriptManager.GetCurrent(Page);
scriptMgr.SetFocus(ddl);
}
Here's the control on the .aspx page:
<asp:DropDownList ID="Organizations" runat="server" Width="205" OnSelectedIndexChanged="Organizations_SelectedIndexChanged" AutoPostBack="True" DataTextField="Name" DataValueField="Id"></asp:DropDownList>
2014.05.22 UPDATE:
In my custom control I have an image button (+) named AddOrganization. In testing the fix yesterday we discovered that if a user clicked the '+' to add a new organization...after they saved the organization...the new value would get auto-selected (as expected) but the tabbing would get reset again. So I had to modify my button click event handler:
protected void Submit_Click(object sender, EventArgs e)
{
if (Page.IsValid)
{
// Do stuff...save organization
// update the list
BindOrganizationList();
// select the new value
Organizations.SelectedIndex = Organizations.Items.IndexOf(Organizations.Items.FindByText(OrganizationName.Text.ToUpper().Trim()));
// reset the form
ResetOrganizationForm();
OrganizationUpdatePanel.Update();
// set focus back to the dropdownlist
ScriptManager scriptMgr = ScriptManager.GetCurrent(Page);
scriptMgr.SetFocus(Organizations);
}
else
{
// Display friendly validation messages to user
}
}
I don't want to show stepname. "Next" and "finish button" is enough for me. How to unvisible these?!
Second question's; after FinishButton's click, I want to redirect first step automatically. How to do?
<asp:Wizard runat="server" ID="MyWizard" OnNextButtonClick="MyWizard_NextButtonClick"
Width="440px" Height="200px" OnFinishButtonClick="MyWizard_FinishButtonClick">
<WizardSteps>
<asp:WizardStep ID="Wizardstep1" runat="server" StepType="auto">
</asp:WizardStep>
<asp:WizardStep ID="Wizardstep2" runat="server" StepType="auto">
</asp:WizardStep>
You can create your custom LayoutTemplate within Wizard control to hide step names. For example:
<LayoutTemplate>
<div>
<asp:PlaceHolder ID="headerPlaceHolder" runat="server" />
</div>
<div>
<asp:PlaceHolder ID="wizardStepPlaceholder" runat="server" />
</div>
<div>
<asp:PlaceHolder ID="navigationPlaceholder" runat="server" />
</div>
</LayoutTemplate>
Remeber that placeholders' id names matter. Placeholer responsible for displaying list of steps that you circled has id sideBarPlaceHolder (and you should not have any placeholder with this id inside LayoutTemlpate)
Second question:
You can have custom navigation template, for example:
<FinishNavigationTemplate>
<asp:Button ID="PreviousButton" runat="server" Text="Previous step" CausesValidation="false" CommandName="MovePrevious" />
<asp:Button ID="FinishButton" runat="server" Text="Finish" CausesValidation="true" CommandName="MoveComplete" OnCLick="FinishButton_Click" />
</FinishNavigationTemplate>
Note that these buttons have fixed CommandName (Wizard control expects this). You can try to use finish button's OnClick event to jump to the first step:
protected void FinishButton_Click(object sender, EventArgs e)
{
yourWizard.ActiveStepIndex = 0;
}
Why my buttons won't work in update panel, but if I press "enter" key it's working?
<asp:ScriptManager ID="Sqrpt1" runat="server"></asp:ScriptManager>
<asp:UpdatePanel UpdateMode="Always" ChildrenAsTriggers="true" ID="updpan" runat="server"><ContentTemplate>
<fieldset>
<asp:Panel runat="server" ID="ClientSearchPa" DefaultButton="SearchClientPopup">
<asp:TextBox ID="SearchClientBox" runat="server"></asp:TextBox>
<asp:Button ID="SearchClientPopup" runat="server" Text="Search"
onclick="SearchClientPopup_Click" /></asp:Panel>
<br />
<asp:ListBox ID="Clients" runat="server" Height="341px" Width="682px"></asp:ListBox>
<br />
<br />
<asp:Label ID="Label3" runat="server" Text="Label"></asp:Label>
<asp:Button ID="ClientSelect" runat="server" OnClick="ClientSelect_Click" Text="button" />
</fieldset>
</ContentTemplate>
</asp:UpdatePanel>
Your code is perfectly alright and button are firing event on server side change your some control values in server events. Your might not be noticing very fast response of ajax call
protected void SearchClientPopup_Click(object sender, EventArgs e)
{
SearchClientBox.Text = "Hello ajax SearchClient clicked";
}
protected void ClientSelect_Click(object sender, EventArgs e)
{
SearchClientBox.Text = "Hello ajax ClientSelect cliecked ";
}
<asp:Panel runat="server" ID="ClientSearchPa" DefaultButton="SearchClientPopup">
<asp:TextBox ID="SearchClientBox" runat="server"></asp:TextBox>
<asp:Button ID="SearchClientPopup" runat="server" Text="Search" onclick=
"SearchClientPopup_Click" />
</asp:Panel>
Here DefaultButton is set to SearchClientPopup.So if the focus is on any control within the Panel,then Enter key will work and SearchClientPopup will fire the click event.
<asp:Button ID="ClientSelect" runat="server" OnClick="ClientSelect_Click" Text="button" />
This button is not inside the panel control.So you have to explicitly fire it by clicking