Here In my code I create one user control. Put two textbox with autocompleteextender and submit button. After access two textbox , submit button Click event not fire. What is wrong in code. Please help me.When I put the updatepanel after that it's not working. I need update panel because two textbox autopostback property is true.
<asp:UpdatePanel runat="server" ID="UpQuote" UpdateMode="Always">
<ContentTemplate>
<div id="Quote">
<table>
<tr>
<td class="tbltdForQuote">
</td>
</tr>
<tr>
<td>
<asp:Label runat="server" ID="lblTitle" Text="Get an instant quote" CssClass="lblForQuote"
Font-Size="Large"></asp:Label>
</td>
</tr>
<tr>
<td class="tbltdForQuote">
</td>
</tr>
<tr>
<td>
<asp:Label runat="server" ID="lblTo" Text="Pick-up Location e.g. Heathrow" CssClass="lblForQuote"></asp:Label>
</td>
</tr>
<tr>
<td>
<asp:TextBox runat="server" ID="txtTo" AutoPostBack="true" autocomplete="off" CssClass="txtBoxForQuote" />
<ajaxToolkit:AutoCompleteExtender runat="server" BehaviorID="AutoCompleteEx1" ID="autoComplete1"
TargetControlID="txtTo" ServicePath="AutoComplete.asmx" ServiceMethod="GetCompletionList"
MinimumPrefixLength="1" CompletionInterval="1000" EnableCaching="true" CompletionSetCount="20"
CompletionListCssClass="autocomplete_completionListElement" CompletionListItemCssClass="autocomplete_listItem"
CompletionListHighlightedItemCssClass="autocomplete_highlightedListItem" DelimiterCharacters=";, :"
ShowOnlyCurrentWordInCompletionListItem="true">
<Animations>
<OnShow>
<Sequence>
<%-- Make the completion list transparent and then show it --%>
<OpacityAction Opacity="0" />
<HideAction Visible="true" />
<%--Cache the original size of the completion list the first time
the animation is played and then set it to zero --%>
<ScriptAction Script="
// Cache the size and setup the initial size
var behavior = $find('AutoCompleteEx1');
if (!behavior._height) {
var target = behavior.get_completionList();
behavior._height = target.offsetHeight - 2;
target.style.height = '0px';
}" />
<%-- Expand from 0px to the appropriate size while fading in --%>
<Parallel Duration=".2">
<FadeIn />
<Length PropertyKey="height" StartValue="0" EndValueScript="$find('AutoCompleteEx1')._height" />
</Parallel>
</Sequence>
</OnShow>
<OnHide>
<%-- Collapse down to 0px and fade out --%>
<Parallel Duration=".4">
<FadeOut />
<Length PropertyKey="height" StartValueScript="$find('AutoCompleteEx1')._height" EndValue="0" />
</Parallel>
</OnHide>
</Animations>
</ajaxToolkit:AutoCompleteExtender>
</td>
</tr>
<tr>
<td class="tbltdForQuote">
</td>
</tr>
<tr>
<td>
<asp:Label runat="server" ID="lblFrom" Text="Drop-off Location e.g.E1 (Postcode)"
CssClass="lblForQuote"></asp:Label>
</td>
</tr>
<tr>
<td>
<asp:TextBox ID="txtFrom" AutoPostBack="true" runat="server" autocomplete="off" CssClass="txtBoxForQuote" />
<ajaxToolkit:AutoCompleteExtender runat="server" BehaviorID="AutoCompleteEx" ID="AutoCompletetxtFrom"
TargetControlID="txtFrom" ServicePath="AutoComplete.asmx" ServiceMethod="GetCompletionList"
MinimumPrefixLength="1" CompletionInterval="1000" EnableCaching="true" CompletionSetCount="20"
CompletionListCssClass="autocomplete_completionListElement" CompletionListItemCssClass="autocomplete_listItem"
CompletionListHighlightedItemCssClass="autocomplete_highlightedListItem" DelimiterCharacters=";, :"
ShowOnlyCurrentWordInCompletionListItem="true">
<Animations>
<OnShow>
<Sequence>
<%-- Make the completion list transparent and then show it --%>
<OpacityAction />
<HideAction Visible="true" />
<%--Cache the original size of the completion list the first time
the animation is played and then set it to zero --%>
<ScriptAction Script="
// Cache the size and setup the initial size
var behavior = $find('AutoCompleteEx');
if (!behavior._height) {
var target = behavior.get_completionList();
behavior._height = target.offsetHeight - 2;
target.style.height = '0px';
}" />
<%-- Expand from 0px to the appropriate size while fading in --%>
<Parallel Duration=".2">
<FadeIn />
<Length PropertyKey="height" StartValue="0" EndValueScript="$find('AutoCompleteEx')._height" />
</Parallel>
</Sequence>
</OnShow>
<OnHide>
<%-- Collapse down to 0px and fade out --%>
<Parallel Duration="1">
<FadeOut />
<Length PropertyKey="hight" StartValueScript="$find('AutoCompleteEx')._height" EndValue="0" />
</Parallel>
</OnHide>
</Animations>
</ajaxToolkit:AutoCompleteExtender>
</td>
</tr>
<tr>
<td class="tbltdForQuote">
</td>
</tr>
<tr>
<td>
<asp:Button runat="server" ID="btnQuoteSubmit" Text="Get Quote >>" UseSubmitBehavior="false"
CssClass="QuoteButton" OnClick="btnQuoteSubmit_Click" CausesValidation="false" />
</td>
</tr>
<tr>
<td style="float: right">
<asp:HyperLink runat="server" ID="HyLogin" Text="Login to your account >>"></asp:HyperLink>
</td>
</tr>
</table>
</div>
</ContentTemplate>
</asp:UpdatePanel>
There are two things you can try. 1. Set the AutoPostBack="True" property in your button declaration. Or if that doesn't work, 2. Take the button out of the update panel.
I found the answer after long search. Basically autocompleteextender not working in user control. because they use webmethod and it's only working on web page not user control
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 kept two radio button inside a datalist footer template but I am not at all able to select it. Below is my footer template:
<FooterTemplate>
<tr>
<td align="right" colspan="7"><br />
</td>
</tr>
<tr>
<td align="left" valign="middle" colspan="7">
<div style="background-color:#FCEE21; height:47px ;">
<div style=" position:relative; top:15px; left:20px;">
<asp:CheckBox ID="cbAgree" Checked="true" Text="I agree on all terms & conditions" runat="server" />
</div>
<div style=" position:relative; top:-1px; left:410px;">
<asp:Label ID="Label2" runat="server" Text="Total: (INR)"></asp:Label>
</div>
<div style=" position:relative; top:-22px; left:550px;">
<asp:Label ID="lbltotal" runat="server" Text="000000" Font-Size="14pt"></asp:Label>
</div>
</div>
</td>
</tr>
<tr>
<td align="right" colspan="7">
<div style="background-image: url(images/footerBg.png); height:47px ;">
<div style=" position:relative; top:10px; left:-172px;">
<asp:Label ID="Label9" runat="server" Text="Select an option: "></asp:Label>
<asp:RadioButton ID="rb1" Text="Colect" AutoPostBack="true" runat="server" GroupName="rboption"/>
<asp:RadioButton ID="rb2" Text="Deliver" AutoPostBack="true" runat="server" GroupName="rboption"/>
</div>
<div style=" position:relative; top:-18px;">
<asp:Button ID="btnSubmit" runat="server" Text="Submit" BackColor="#F8CD20" CssClass="anchor"
BorderColor="#F8CD20" BorderStyle="None" OnClick=" Submit_Clicked" Font-Bold="True" Font-Size="14pt"
Height="38px" Width="105px" />
</div>
</div>
</td>
</tr>
</FooterTemplate>
I have not done any databinding also. Please help me out, if I missed out something.
Your problem is about your css styling. If you remove inline css styles from your divs you can click them.
Those divs are displaying on top of each other without proper styles and radiobuttons stay under another div, prevents you clicking on them.
Or if you want to keep the styles and still click them you can use "z-index" attribute with adding z-index:1;, so you bring the div with radiobuttons, above the other div, making them clickable.
....
<div style=" position:relative; top:10px; left:-172px; z-index:1;">
<asp:Label ID="Label9" runat="server" Text="Select an option: "></asp:Label>
<asp:RadioButton ID="rb1" Text="Colect" AutoPostBack="true" runat="server" GroupName="rboption"/>
<asp:RadioButton ID="rb2" Text="Deliver" AutoPostBack="true" runat="server" GroupName="rboption"/>
</div>
....
Overview: Clicking on text of first CheckBox in a repeater control clicks the last one. I know why this is happening; association of label tag with element id chkMarkedForDeletion and when that label is clicked it selects the last CheckBox, as all the CheckBoxes have same ID.. damn you repeater control!! I am wondering if there is any way to avoid this? Easy way would be to create individual labels and associate correctly to each CheckBox but that defeats the supposed default behaviour of a CheckBox.
Repeater code:
<asp:Repeater ID="childNodesDataRepeater" runat="server">
<ItemTemplate>
<table style="width: 100%;" cellpadding="0" cellspacing="0" border="0">
<tr>
<td style="width: 200px;">
<asp:CheckBox ID="chkMarkedForDeletion" runat="server" EnableViewState="true" Text="Remove"
Checked='<%# DataBinder.Eval(Container.DataItem, "IsMarkedForDeletion") %>' />
</td>
<td>
</td>
<td style="width: 200px;">
<asp:CheckBox ID="chkHighImpactCause" runat="server" EnableViewState="true" Text="High Impact Cause"
Checked='<%# DataBinder.Eval(Container.DataItem, "IsHighPriority") %>' />
</td>
</tr>
<tr>
<td colspan="3">
<asp:Label ID="header002" runat="server" Text="What caused this problem?" />
</td>
</tr>
<tr>
<td colspan="3">
<asp:TextBox ID="txtProblemCausedBy" runat="server" EnableViewState="true" Width="100%"
Text='<%# DataBinder.Eval(Container.DataItem, "Description") %>' /><br />
</td>
</tr>
<tr>
<td colspan="3" style="height: 5px;">
<hr />
<asp:HiddenField ID="nodeIdentifier" runat="server" EnableViewState="true" Value='<%# DataBinder.Eval(Container.DataItem, "AnalysisID") %>' />
</td>
</tr>
</table>
</ItemTemplate>
</asp:Repeater>
Generated HTML Code for CheckBox:
<INPUT id=chkMarkedForDeletion type=checkbox name=TabContainer$tabProblemResolution$frmProblemResolution1$childNodesDataRepeater$ctl00$chkMarkedForDeletion>
<LABEL for=chkMarkedForDeletion>Remove</LABEL>
...
...
<INPUT id=chkMarkedForDeletion type=checkbox name=TabContainer$tabProblemResolution$frmProblemResolution1$childNodesDataRepeater$ctl02$chkMarkedForDeletion>
<LABEL for=chkMarkedForDeletion>Remove</LABEL>
Issue:
Thanks,
Abhi
Make sure the ClientIDMode on the repeater is not set to "Static".
This setting is inheritable from the parent, which goes all the way up to web.config. So if you have to set the ClientIDMode explicitly on the repeater, it means that some parent overrides the default (Predictable) to "Static".
I have a fileupload control with an updatePprogress in an updatePanel like this:
UpdatePanel is: updExtraSmall
<Triggers>
<asp:PostBackTrigger ControlID="lnkExtraSmall" />
</Triggers>
<ContentTemplate>
<table>
<tr>
<td style="border: 1px">
<asp:FileUpload ID="fupldExtraSmall" runat="server" />
</td>
<td>
<asp:LinkButton ID="lnkExtraSmall" OnClientClick="javascript:showWait();" OnClick="lnkExtraSmall_click" CausesValidation="false"
runat="server" Text="Upload" />
<asp:Label ID="lblMessage" runat="server" />
</td>
<td>
<asp:Label ID="lblExtraSmallMessage" runat="server" />
</td>
<td>
<asp:UpdateProgress ID="UpdateProgress1" runat="server" AssociatedUpdatePanelID="updExtraSmall">
<ProgressTemplate>
<DIV id="IMGDIV" align="center" valign="middle" runat="server" style="position: absolute;left: 35%;top: 25%;visibility:visible;vertical-align:middle;border-style:inset;border-color:black;background-color:White">
<img src="loading/loading.gif" /><br />
</DIV>
</ProgressTemplate>
</asp:UpdateProgress>
</td>
</tr>
</table>
</ContentTemplate>
and:
function showWait()
{
if ($get('fupldExtraSmall').value.length > 0)
{
$get('UpdateProgress1').style.display = 'block';
}
}
The problem is that the updateProgrss doesn't show.
Can anyone help me please?
Thank you,
Alina
Just Use the asyncfileupload control which come with ajaxcontroltoolkit 3.0 and then upload the file.
Put the UpdateProgress outside the ContentTemplate.
Ref: http://msdn.microsoft.com/en-us/library/bb398821.aspx
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.