I have a drop-down list which gathers data from the database and a textbox which contains the text from the drop-down list when I select a value from the drop-down list. I tried to make this work, but no data appears in the textbox when I select a value from the drop-down list and no errors appear either. Can anyone help me?
aspx Code:
<table id="Tbl" runat="server" width="70%" border="1" cellspacing="1" cellpadding="1">
<tr>
<td>
Select
</td>
<td>
<asp:SqlDataSource ID="SDSOption" runat="server" ConnectionString="Data Source=ELARABY-1EACFA3\SQLEXPRESS;Initial Catalog=ElarabyGroup;Integrated Security=True"
ProviderName="System.Data.SqlClient" SelectCommand="SELECT [Id], [option] FROM [Option]">
</asp:SqlDataSource>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:DropDownList ID="DropDownList1" runat="server" DataSourceID="SDSOption" DataTextField="option"
DataValueField="Id" ondatabound="DropDownList1_DataBound"
onselectedindexchanged="DropDownList1_SelectedIndexChanged">
</asp:DropDownList>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="DropDownList1" EventName="SelectedIndexChanged" />
</Triggers>
</asp:UpdatePanel>
</td>
<td>
<b style="font-style: italic">Select Option</b> <b style="font-style: italic">
<br />
<asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ControlToValidate="TxtOption"
Display="Dynamic" ErrorMessage="*" SetFocusOnError="True"><b style="font-style: italic">*</b></asp:RequiredFieldValidator>
</b>
</td>
</tr>
<tr>
<td class="style2">
<asp:Label ID="LblOption" runat="server" Text="Option"></asp:Label>
</td>
<td class="style1">
<asp:TextBox ID="TxtOption" runat="server"></asp:TextBox>
</td>
<td>
<b style="font-style: italic">Note:Add Here Product Option</b> <b style="font-style: italic">
<br />
<asp:RequiredFieldValidator ID="RVOption" runat="server" ControlToValidate="TxtOption"
Display="Dynamic" ErrorMessage="*" SetFocusOnError="True"><b style="font-style: italic">*</b></asp:RequiredFieldValidator>
</b>
</td>
</tr>
<tr style="font-style: italic">
<td class="style2">
</td>
<td>
<asp:Button ID="BtnSubmit" runat="server" Height="20px" Text="Submit" Width="50px"
OnClick="BtnSubmit_Click" />
</td>
<td align="left">
<b><i><span><a href="EditOption.aspx">
<asp:Image ID="Image1" runat="server" ImageUrl="~/Backend/Image/www_4photos_net_1137678404.jpg"
Width="60px" /></a> Display Other </span></i></b>
</td>
</tr>
</table>
CS Code:
protected void DropDownList1_SelectedIndexChanged(object sender, EventArgs e)
{
TxtOption.Text += DropDownList1.SelectedItem.Value;
}
The DropDownList is wrapped in an UpdatePanel, but the TextBox is not.
What this means is during the asychronous postback (triggered on the SelectedIndexChanged event), the postback only has visiblity of the controls inside the UpdatePanel (as this is all that gets submitted to the server).
Because the TextBox is outside the UpdatePanel, it does not have visibility of it during the async postback.
The easiest solution would be to put the Textbox inside the UpdatePanel.
Another solution would be to use ScriptManager.RegisterStartupScript to set the value of the control from the SelectedIndexChanged event using basic JavaScript (which has access to the entire DOM, unlike the asynchronous postback).
E.g
protected void DropDownList1_SelectedIndexChanged(object sender, EventArgs e)
{
ScriptManager.RegisterStartupScript(UpdatePanel1,
this.GetType(),
"NameOfScript",
string.Format("document.getElementById('{0}').value = '{1}';",
txtOption.ClientId,
DropDownList1.SelectedValue));
}
Related
i have an user control in that i used cascading drop down for states,districts and areas...how to load cascading drop down in user control page load....cascading Drop down code is
<table>
<tr>
<td class="caption">
State:
<asp:DropDownList ID="ddlCState" runat="server" CssClass="userentry">
</asp:DropDownList>
<cc1:CascadingDropDown ID="cdlCStates" TargetControlID="ddlCState" PromptText="Select State"
ServicePath="~/CasCadingDropDown.asmx" ServiceMethod="GetStates" runat="server"
Category="StateId" LoadingText="Loading..." />
</td>
</tr>
<tr>
<td class="caption">
District:
<asp:DropDownList ID="ddlCDistrict" runat="server" CssClass="userentry">
</asp:DropDownList>
<cc1:CascadingDropDown ID="cdlCDistrict" TargetControlID="ddlCDistrict" PromptText="Select District"
ServicePath="~/CasCadingDropDown.asmx" ServiceMethod="GetDistricts" runat="server"
Category="DistrictId" ParentControlID="ddlCState" LoadingText="Loading..." />
</td>
</tr>
<tr>
<td class="caption">
Area:
<asp:DropDownList ID="ddlCArea" runat="server" CssClass="userentry">
</asp:DropDownList>
<cc1:CascadingDropDown ID="cdlCAreas" TargetControlID="ddlCArea" PromptText="Select Area"
ServicePath="~/CasCadingDropDown.asmx" ServiceMethod="GetAreas" runat="server"
Category="AreaId" ParentControlID="ddlCDistrict" LoadingText="Loading..." />
</td>
</tr></table>
I have registration form for users to fill up. In there, one field is there to which if user checks on the button a text box shoulld be enabled to enter the number. I have used following code :
<asp:UpdatePanel ID="upMSME" runat="server">
<ContentTemplate>
<tr>
<td colspan="2">
<asp:Label ID="lblMSME" runat="server" Text="Whether covered under MSME (Tick whichever is applicable)"></asp:Label>
<asp:CheckBox AutoPostBack="true" Checked="true" ID="chbMSME" runat="server" OnCheckedChanged="chbMSME_CheckedChanged" ClientIDMode="AutoID"/>
</td>
</tr>
<tr id="trMSMENo" runat="server">
<td>
<asp:Label ID="lblMSMENo" runat="server" Text="MSME Number" CssClass="alignTop"></asp:Label>
</td>
<td class="ValueBox">
<asp:TextBox ID="txtMSMENo" runat="server" MaxLength="75"></asp:TextBox>
<asp:RequiredFieldValidator ID="rfvMSMENo" runat="server" ForeColor="Red" ErrorMessage="*" ControlToValidate="txtMSMENo" ValidationGroup="vgVendor"></asp:RequiredFieldValidator>
</td>
</tr>
</ContentTemplate>
</asp:UpdatePanel>
However I searched over internet and found that by setting the ClientIDMode="AutoID" the issue is resolved. But in my case after setting the property there is still full postback occurred.
I have another update panel also in this form, does it make any difference?
What am I missing?
I am using dropdownlist placed inside ajax tab container.but it doesnt postback even though i have set autopostback property to true.This happens only in firefox and not in IE or chrome.Can any body help me regarding this.I am using ajax toolkit version 4.1.50731.0.
<asp:TabContainer ID="TabContainer2" runat="server" Width="100%" CssClass="myTab"
Height="2200px" ActiveTabIndex="0">
<asp:TabPanel ID="TabPanel8" runat="server" HeaderText="Add Transaction">
<ContentTemplate>
<div>
<table class="style1">
<tr>
<td class="style16">
</td>
<td align="right" class="style15">
Select News Heading :
</td>
<td>
<asp:DropDownList ID="DropDownList1" runat="server" OnSelectedIndexChanged="DropDownList1_SelectedIndexChanged"
AutoPostBack="True" >
</asp:DropDownList>
<asp:RequiredFieldValidator ID="RequiredFieldValidator12" runat="server" ControlToValidate="DropDownList1"
ErrorMessage="Please Select News Heading" ValidationGroup="a" InitialValue="Select News Heading">*</asp:RequiredFieldValidator><asp:ValidatorCalloutExtender
ID="RequiredFieldValidator12_ValidatorCalloutExtender" runat="server" Enabled="True"
TargetControlID="RequiredFieldValidator12">
</asp:ValidatorCalloutExtender>
<asp:Label ID="Label3" runat="server"></asp:Label>
</td>
<td>
</td>
</tr>
<tr>
<td class="style16">
</td>
<td align="right" class="style15">
</td>
<td>
</td>
<td>
</td>
</tr>
<tr>
<td class="style16">
</td>
<td align="right" class="style15">
Select Sub Heading :
</td>
<td>
<asp:DropDownList ID="DropDownList2" runat="server" OnLoad="DropDownList2_Load">
</asp:DropDownList>
<asp:RequiredFieldValidator ID="RequiredFieldValidator14" runat="server" ControlToValidate="DropDownList2"
ErrorMessage="Please select sub heading" ValidationGroup="a" InitialValue="Select News Name">*</asp:RequiredFieldValidator><asp:ValidatorCalloutExtender
ID="RequiredFieldValidator14_ValidatorCalloutExtender" runat="server" Enabled="True"
TargetControlID="RequiredFieldValidator14">
</asp:ValidatorCalloutExtender>
<asp:Label ID="Label4" runat="server"></asp:Label>
</td>
<td>
</td>
</tr>
</ContentTemplate>
</asp:TabPanel>
</asp:TabContainer>
you do appear to be missing a closing </table> and </div> tag from your content template.
does adding those fix your problem?
edit
Does your javascript console (e.g. firebug in firefox) give you any javascript errors?
Solution to your problem that I assume is:
If validation is failing then DropDownList won't PostBack, so please try once by disabling the Validators on DropDownList.
Some points to note
RequiredFieldValidator should have Display="None" as you are using ValidatorCalloutExtender
Put CausesValidation on the DropDownList and RequiredFieldValidator
It would result in auto triggering the validation on server-side.
Check the Page.IsValid in the SelectedIndexChanged event handler before proceeding any other code parts.
I hope you are coding well,
I am working on a Image Upload module , which is in a Modal Popup and hence is wrapped inside an Update Panel,
<asp:UpdatePanel runat="server" ID="UpdateModelPopup" UpdateMode="Conditional" ChildrenAsTriggers="true">
<Triggers>
<asp:AsyncPostBackTrigger ControlID="lnkUploadImage" EventName="Click" />
</Triggers>
<ContentTemplate>
<asp:Panel runat="server" ID="pnlModel" CssClass="ModalWindow">
<!-- Style="display: none;" -->
<table border="0" class="modalTable" cellspacing="5">
<tr>
<td>
Keywords 2<strong><font color="#FF0000">*</font></strong> <i>(Seperated by , )</i>
<br />
<asp:TextBox runat="server" ID="txtKeywordsTwo"></asp:TextBox><br />
</td>
<td>
Dimensions <strong><font color="#FF0000">*</font></strong>
<br />
Width :
<asp:TextBox ID="txtDimWidth" runat="server" Width="50px"></asp:TextBox>
Height :
<asp:TextBox ID="txtDimHeight" runat="server" Width="50px"></asp:TextBox>
</td>
<tr>
<td colspan="2">
<hr />
</td>
</tr>
<tr>
<td>
Browse .psd file<br />
<ajaxToolkit:AsyncFileUpload runat="server" ID="pdfFile" Width="200px" OnUploadedComplete="pdfFile_UploadedComplete"
CompleteBackColor="" ErrorBackColor="" OnClientUploadComplete="Success" />
<asp:Image runat="server" ID="imgThumbNail" /><br />
<font color="#FF0000">or</font><br />
Refrence URL<br />
<asp:TextBox ID="TextBox11" runat="server"></asp:TextBox>
</td>
<td>
Browse file <i>(.jpeg, .gif or .png)</i><strong><font color="#FF0000">*</font></strong><br />
<ajaxToolkit:AsyncFileUpload runat="server" ID="AsyncFileUpload1" Width="200px" />
</td>
</tr>
</table>
<asp:Button runat="server" ID="btnUpload" Text="Upload" CssClass="btn" OnClick="btnUpload_Click" />
</asp:Panel>
</ContentTemplate>
</asp:UpdatePanel>
Now as per the business requirement, I need to show a thumbnail of the Image that user uploads, and for .psd file I have a standard icon which I display's at the run time, in the code behind I am validating the file extension to be the .psd file and it is then display the psd icon, I am trying to set the ImageURL for
protected void pdfFile_UploadedComplete(object sender, AjaxControlToolkit.AsyncFileUploadEventArgs e)
{
if (Path.GetExtension(e.FileName).ToString().ToLower() != ".psd")
{
string alertMsg = #"alert('Please provide .PSD type file');";
ScriptManager.RegisterStartupScript(this, this.GetType(), "Test", alertMsg, true);
//pdfFile
}
else
{
imgThumbNail.ImageUrl ="~/images/psdIcon.jpg";
}
}
The problem is that Panel doesnt gets update at the run time, even the page source shows src="". I am suspecting that its a Update Panel issue.
Kindly point me into the right direction.
Thanks in advance
FileUpload can not be done Asynchronously. In order to do that PostBackTrigger Trigger will be required to upload.
I have a button which is not working when placed below two panels. If I move it above the panels, it works.
It works either way in Firefox. It does not work in IE 8
The button runs this code
protected void Button2_Click(object sender, EventArgs e)
{
panelForm.Enabled = true; //input panel
panelOutput.Visible = false; //output panel
Button1.Visible = true; //input panel button
}
I have some workarounds, but was hoping to find the cause of the issue.
edit: here is the markup of the second panel and button. I've tried moving the button outside of the panel and get the same result.
<asp:Content ID="MainContent" Runat="Server" ContentPlaceHolderID="MainContentPlaceHolder">
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:TextBox ID="domainUserID" runat="server" Visible="false"></asp:TextBox>
<!-- gray bar and title -->
<table style="width:100%; border-style:none;">
<tr>
<td class="com_headline">
SQL Emergency Request [Home]
</td>
</tr>
<tr class="com_app_instructions">
<td>
<p>Words here</p>
</td>
</tr>
</table>
<!-- end title and gray bar -->
<asp:Panel ID="panelForm" runat="server" Visible="True" CssClass="myform">
<form method="post" action="Default.aspx" id="form">
<h1>Request Form</h1>
<p>Complete this form to be issued a login</p>
<table cellpadding="5px">
<tr>
<td>
IR Number
<br />
<span class="small">Obtain your IR number from
SMART</span>
</td>
<td>
<asp:TextBox ID="txtIR" runat="server"></asp:TextBox>
</td>
<td>
<asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server"
ControlToValidate="txtIR" CssClass="errorMsg"
ErrorMessage="Please Enter Your IR Number">
</asp:RequiredFieldValidator>
</td>
</tr>
<tr>
<td>
Server
<br />
<span class="small">MSSQL5 is supported for now</span>
</td>
<td>
<asp:DropDownList ID="ddServer" runat="server" AutoPostBack="True"
Enabled="False" onselectedindexchanged="ddServer_SelectedIndexChanged">
<asp:ListItem>DEVMSSQL05</asp:ListItem>
<asp:ListItem Selected="True">MSSQL05</asp:ListItem>
</asp:DropDownList>
</td>
<td>
<asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server"
ControlToValidate="ddServer" CssClass="errorMsg"
ErrorMessage="Please Choose A Server">
</asp:RequiredFieldValidator>
</td>
</tr>
<tr>
<td>
Database
<br />
<span class="small">You have the role of 'Analyst' in these databases</span>
</td>
<td>
<asp:DropDownList ID="ddDatabase" runat="server" AppendDataBoundItems="true"
AutoPostBack="false" DataSourceID="DatabaseDropDownObjectDataSource"
DataTextField="DatabaseName" DataValueField="DatabaseName" Width="150">
</asp:DropDownList>
</td>
<td>
</td>
</tr>
<tr>
<td></td>
<td>
<asp:Button ID="Button1" runat="server" CssClass="com_btn_flat"
onclick="Button1_Click" Text="Submit" />
</td>
<td>
<div id="loader">loading...</div>
</td>
</tr>
</table>
</form>
</asp:Panel>
<asp:Panel ID="PanelError" runat="server" Visible="false" CssClass="errorPanel">
<h1><asp:Label ID="txtErrorMsg" runat="server">error text</asp:Label></h1>
</asp:Panel>
<br />
<asp:Panel ID="panelOutput" runat="server" Visible="false" CssClass="panelOutput">
<h1>
<asp:Literal ID="Title" runat="server" Text=""/>
</h1>
<p>
<asp:Literal ID="Warning" runat="server" Text=""/>
</p>
<p>
<asp:Literal ID="LoginLifeHours" runat="server" Text=""/>
</p>
<p>
<span class="important">
<asp:Literal ID="Login" runat="server" Text="" />
</span>
</p>
<p>
<span class="important">
<asp:Literal ID="PWD" runat="server" Text="" />
</span>
</p>
<br />
<p>
<asp:Button ID="Button2" runat="server" Text="Request Another Login"
onclick="Button2_Click" CssClass="com_btn_flat" />
</p>
</asp:Panel>
This is the button that is not responding in IE
<p>
<asp:Button ID="Button2" runat="server" Text="Request Another Login"
onclick="Button2_Click" CssClass="com_btn_flat" />
</p>
The problem is that you are using a <form> tag within your content page. The master page already includes a <form> tag and IE appears to be balking at the form within a form. When I removed the <form> tag from your aspx, the button handler ran under IE8.
The sample code is Button2_Click, but your button markup outside of the panels has test_button_Click as the event handler? There are three buttons, so which one are you asking about, I assume the last?
I noticed that you have a tag inside your first panel (panelForm). Also, I don't see a a tag with a runat="server" attribute (although, it could be in a master page). And it doesn't look like your button is inside a form (unless the master page has a form).
The problem is that you can only have one form on a page in Asp.NET WebForms. If you don't have any <form runat="server"> tags on your page, then you buttons will not fire any events on the code-behind.