I have a C# Checkboxlist within a hidden div. The div displays upon certain events, then is closed. When the form is submitted, I try to update database bit fields based on selected values of the checkboxlist.items but they always return false whether checked or not. How can I get the selected value of the items when the div containing them is hidden?
The div is a dialog I show/hide using jquery
$(document).ready(function () {
$('#<%=txtLANG.ClientID %>').click(function () {
$("#overlay-back").dialog({
resizable: false,
modal: true,
width: 500,
height: 400,
buttons: {
OK: function () {
GetLanguages();
$(this).dialog("close");
},
Cancel: function () {
$(this).dialog("close");
}
}
});
});
});
and here's the DIV...the codebehind is nothing more than setting a parameter to true/false based on selected value of the checkboxlist items
<div id="overlay-back" style="display:none;">
<table width="100%">
<tr>
<td width="50%">
<asp:CheckBox runat="server" ID="chkEnglish" TextAlign="Right" Text=" English" />
<div class="popup-container">
<img id="help_button_chkEnglish" class="help-button" src="/Images/help-button.png" alt="" />
<div class="help-popup hidden" id="help_popup_chkEnglish">
<div class="popup-arrow-border"></div> <div class="popup-arrow"></div>
<asp:Label runat="server" ID="lblLANGDesc"></asp:Label>
</div>
</div>
</td>
<asp:Panel runat="server" ID="pnlTopLanguages">
<td rowspan="3" valign="top">
<asp:CheckBoxList ID="chkTopLanguages" TextAlign="Right" runat="server" />
<br />
<asp:Label runat="server" ID="lblNonTopLanguages"></asp:Label><br />
<asp:TextBox runat="server" ID="txtOtherLanguages" onkeypress="CopyOtherLangs(event)" onclick="clearLanguageSearchText()" Text="Other Languages..."></asp:TextBox>
<cc3:AutoCompleteExtender ID="aceSearch" runat="server" MinimumPrefixLength="1" TargetControlID="txtOtherLanguages"
ServicePath="~/controls/wsCommunity.asmx" ServiceMethod="GetLanguageCompletionList">
</cc3:AutoCompleteExtender>
</td>
<td rowspan="3">
<div class="popup-container">
<img id="help_button_chkTopLanguages" class="help-button" src="/Images/help-button.png" alt="" />
<div class="help-popup hidden" id="help_popup_chkTopLanguages">
<div class="popup-arrow-border"></div> <div class="popup-arrow"></div>
<asp:Label runat="server" ID="lblTopLangs"></asp:Label>
</div>
</div>
</td>
</asp:Panel>
</tr>
<tr>
<td>
<asp:CheckBox runat="server" ID="chkFrench" TextAlign="Right" Text=" French" />
<div class="popup-container">
<img id="help_button_chkFrench" class="help-button" src="/Images/help-button.png" alt="" />
<div class="help-popup hidden" id="help_popup_chkFrench">
<div class="popup-arrow-border"></div> <div class="popup-arrow"></div>
<asp:Label runat="server" ID="Label2"></asp:Label>
</div>
</div>
</td>
</tr>
<asp:Panel runat="server" ID="pnlEnhancedFrench">
<tr>
<td valign="top">
<asp:CheckBoxList ID="chkEnhancedFrench" TextAlign="Right" CssClass="EnhancedFrench" runat="server">
<asp:ListItem> Customer Service</asp:ListItem>
<asp:ListItem> Publications</asp:ListItem>
<asp:ListItem> Website</asp:ListItem>
<asp:ListItem> Interpreters</asp:ListItem>
</asp:CheckBoxList>
</td>
</tr>
</asp:Panel>
</table>
</div>
Related
I am trying to get autocomplete feature for textboxes firstname and lastname . I m using Obout Textboxes here . The problem is , autocomplete feature is not working forthe obout control but it is working fine for asp.net input type=text control .
Note that controls are in master page.
<script type="text/javascript">
$(document).ready(function () {
$('#<%=txtFirstName.ClientID%>').autocomplete({ source: '/Controls/AutoCompleteXHandlers/UserFirstNameXHandler.ashx', appendTo: "#firstNameContainer" });
$('#<%=txtLastName.ClientID%>').autocomplete({ source: '/Controls/AutoCompleteXHandlers/UserLastNameXHandler.ashx', appendTo: "#lastNameContainer" });
});
</script>
<div id="titleDesc" runat="server">
<p style="color: Red; text-align: left; font-weight: bold">
Please use this form to Manage the User(Contractor/Govt) Account. All questions with an '*'
are required.Enter the FirstName and LastName for the Account you wish to manage.
</p>
</div>
<br />
<br />
<div id="NewRegPage" class="dvNewRegParam" style="margin-left: 20px;" runat="server">
<table id="tblManageUser" class="tblNewRegParam">
<tr>
<td style="padding: 5px 0 6px 10px;" class="td2">
<b>*First Name</b>
</td>
<td>
<obout:OboutTextBox ID="txtFirstName" runat="server" Width="220" >
</obout:OboutTextBox>
<%-- <input id="txtFirstName" type="text" runat="server" style="width: 220px" />--%>
<div id="firstNameContainer" style="width: auto"></div>
<asp:RequiredFieldValidator ID="RFVFirstName" runat="server" ControlToValidate="txtFirstName" ValidationGroup="ManageUserAccount"
Text="*First Name is required" CssClass="error" Display="Dynamic"></asp:RequiredFieldValidator>
</td>
</tr>
I am getting an error Uncaught Reference error: ClickInfo() is not defined. I included the required JS source files in the project library.
I am not sure whats wrong in the code...
<div id="dvRegion" runat="server">
<h3> <a href="#" id="InfoExpand" onclick="return ClickInfo()">
<img src="../Styles/img/PlusCircle.png" id="InfoToggle" /></a>
<asp:Label ID="Label1" runat="server" Text="Info:" /></h3>
<div id="dvInfoRegion">
<table>
<tr>
<td>
<h5> <asp:Label ID="l1" runat="server" Text="a" /></h5>
</td>
<td>
<h6>
<div runat="server" id="dv1">
</div>
</h6>
</td>
</tr>
<tr>
<td>
<h5> <asp:Label ID="l2" runat="server" Text="b" /></h5>
</td>
<td>
<h6>
<div runat="server" id="dv2">
</div>
</h6>
</td>
</tr>
<tr>
<td>
<h5> <asp:Label ID="l3" runat="server" Text="c" /></h5>
</td>
<td>
<h6>
<div runat="server" id="dv3">
</div>
</h6>
</td>
</tr>
</table>
</div>
</div>
<script type="text/javascript">
$(document).ready(function () {
$("#dvInfoRegion").hide();
ClickInfo();
});
function ClickInfo() {
toggleRegion($("#dvInfoRegion"), $("#InfoToggle"));
return false;
}
function toggleRegion(region, toggle) {
if (region.is(":visible")) {
region.slideUp();
toggle.attr("src", "../Styles/img/PlusCircle.png");
}
else {
region.slideDown();
toggle.attr("src", "../Styles/img/MinusCircle.png");
}
}
can someone please, have a look at the code and tell me whats wrong? Thanks!
Try event handling and see if this works. It's better syntactically than to write inline javascript.
Remove the onclick attribute from the anchor link
<a href="#" id="InfoExpand">
<img src="../Styles/img/PlusCircle.png" id="InfoToggle" />
</a>
and
$(document).ready(function () {
$("#dvInfoRegion").hide();
ClickInfo();
$('#InfoExpand ').click(function() {
ClickInfo();
});
});
I have a page where I am using 3 update panels and all the update panels are working well. In one of the update panels, I have a button which on click changes label text but the problem is that on if post back happens in any of the update panels file upload loses its file.
All the update panels are used to update separate sections of page. No update panel is nested. The file upload is outside; it is not in any of the update panels but it is still losing its file.
<%# Control Language="C#" AutoEventWireup="true" CodeFile="WalkInControl.ascx.cs"
Inherits="Modules_WalkInControl" %>
<%# Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="ajaxtoolkit" %>
<asp:Panel ID="Panel1" runat="server" Font-Size="13px" Width="670">
<asp:UpdatePanel ID="UpdatePanel1" runat="server" ChildrenAsTriggers ="true" UpdateMode="Conditional">
<ContentTemplate>
<div class="formfieldset" style="margin-bottom: 40px;">
<div class="formrow">
<div class="paymentfrmlabels">
Check In :</div>
<div class="paymentfrmtxtbox">
<asp:TextBox ID="txtCheckIn" runat="server" Width="153px"></asp:TextBox>
<asp:ImageButton ID="imgbtnCalendar1" runat="server" ImageUrl="~/App_Themes/Default/images/ico-calendar.gif"
CausesValidation="false" Width="20" Height="20" />
<ajaxtoolkit:CalendarExtender ID="CalendarExtender2" runat="server" Format="dd/MM/yyyy"
TargetControlID="txtCheckIn" PopupButtonID="imgbtnCalendar1" />
</div>
<div class="paymentfrmvalidation">
<asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ErrorMessage="[*]"
ControlToValidate="txtCheckIn" Display="Dynamic" ValidationGroup="a"></asp:RequiredFieldValidator>
</div>
</div>
<div class="formrow">
<div class="paymentfrmlabels">
Check Out:
</div>
<div class="paymentfrmtxtbox">
<asp:TextBox ID="txtCheckOut" runat="server" Width="153px"></asp:TextBox>
<asp:ImageButton ID="imgbtnCalendar" runat="server" ImageUrl="~/App_Themes/Default/images/ico-calendar.gif"
CausesValidation="false" ImageAlign="Top" Width="20" Height="20" />
<ajaxtoolkit:CalendarExtender ID="CalendarExtender1" runat="server" Format="dd/MM/yyyy"
TargetControlID="txtCheckOut" PopupButtonID="imgbtnCalendar" />
</div>
<div class="paymentfrmvalidation">
<asp:RequiredFieldValidator ID="valStartDate" runat="server" ErrorMessage="[*]" ControlToValidate="txtCheckOut"
Display="Dynamic" ValidationGroup="a"></asp:RequiredFieldValidator>
</div>
</div>
<div class="formrow">
<div class="paymentfrmlabels">
Room Type :
</div>
<div class="paymentfrmtxtbox">
<asp:DropDownList ID="drpRoomtype" runat="server" Width="172px" AutoPostBack="True"
OnSelectedIndexChanged="drpRoomtype_SelectedIndexChanged" AppendDataBoundItems="True">
</asp:DropDownList>
</div>
</div>
<div class="formrow">
<div class="paymentfrmlabels">
Plan :
</div>
<div class="paymentfrmtxtbox" style="height: 25px;">
<asp:DropDownList ID="drpPlan" Width="172px" AutoPostBack="True"
runat="server" onselectedindexchanged="drpPlan_SelectedIndexChanged1">
</asp:DropDownList>
</div>
</div>
<div class="formrow" style="height: 75px;">
<div class="paymentfrmlabels">
Room :
</div>
<div class="paymentfrmtxtbox">
<asp:ListBox ID="lstRooms" runat="server" Width="172px" SelectionMode="Multiple">
</asp:ListBox>
</div>
<div class="paymentfrmvalidation">
<asp:RequiredFieldValidator ID="RequiredFieldValidator3" runat="server" ControlToValidate="lstRooms"
ErrorMessage="[*]" ValidationGroup="b"></asp:RequiredFieldValidator>
</div>
<div class="paymentfrmvalidation">
<asp:UpdateProgress ID="UpdateProgress1" runat="server" AssociatedUpdatePanelID="UpdatePanel1">
<ProgressTemplate>
<img src="../Images/loading_sm.gif" border="0" alt="">
</ProgressTemplate>
</asp:UpdateProgress>
<asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server" ControlToValidate="drpRoomtype"
ErrorMessage="[*]" ValidationGroup="a"></asp:RequiredFieldValidator>
</div>
</div>
<div class="formrow">
<div class="paymentfrmlabels">
Adults :
</div>
<div class="paymentfrmtxtbox" style="width: 50px; height: 25px;">
<asp:DropDownList ID="drpAdults" Width="50px" runat="server" AutoPostBack="True"
OnSelectedIndexChanged="drpAdults_SelectedIndexChanged" AppendDataBoundItems="True">
</asp:DropDownList>
</div>
<div class="paymentfrmlabels" style="width: 65px;">
Children :
</div>
<div class="paymentfrmtxtbox" style="width: 50px; height: 25px;">
<asp:DropDownList ID="drpChildren" Width="50px" runat="server" AutoPostBack="True"
OnSelectedIndexChanged="drpChildren_SelectedIndexChanged">
</asp:DropDownList>
</div>
</div>
<div class="formrow">
<div class="paymentfrmlabels">
Rate :</div>
<div class="paymentfrmtxtbox">
<asp:TextBox ID="txtRate" Width="153px" runat="server"></asp:TextBox>
</div>
<div class="paymentfrmvalidation">
<%--<asp:RegularExpressionValidator ID="RegularExpressionValidator1" runat="server" ControlToValidate="txtRate"
ErrorMessage="Invalid Format" ValidationExpression="^(-)?\d+(\.\d\d)?$" ValidationGroup="a"></asp:RegularExpressionValidator>
<asp:RequiredFieldValidator ID="RequiredFieldValidator4" runat="server" ControlToValidate="txtRate"
ErrorMessage="Rate Required" ValidationGroup="a"></asp:RequiredFieldValidator></div>--%>
</div>
</div> <div align="center"> <asp:Label ID="lblRoomMsg" runat="server" ForeColor="Red"></asp:Label></div>
<div class="formrow">
<div class="paymentfrmlabels">
Advance Pay:
</div>
<div class="paymentfrmtxtbox" style="height: 25px;">
<asp:TextBox ID="txtAdvance" runat="server" Width="153px">0.0</asp:TextBox>
</div>
</div>
<div class="formrow" style="text-align: right;">
<asp:LinkButton ID="lnkAdd" CssClass="btn" runat="server" Width="60px" OnClick="lnkAdd_Click1">ADD</asp:LinkButton>
</div>
<div class="formrow" style="text-align:center;">
<asp:CompareValidator ID="CompareValidator1" runat="server" ControlToCompare="txtCheckOut"
ControlToValidate="txtCheckIn" Operator="LessThanEqual" Type="Date" ForeColor="Red" ErrorMessage="CheckIn Must Be Before CheckOut"
Display="Dynamic" ValidationGroup="a"/>
</div>
<div class="formrow" style="height: auto; margin-top: 20px; width: 430px;">
<asp:GridView ID="gvAddedRooms" runat="server" CssClass="active-grid" AutoGenerateColumns="False"
DataKeyNames="ID" Height="18px" Width="100%" OnRowDeleting="gvAddedRooms_RowDeleting">
<Columns>
<asp:BoundField DataField="ID" HeaderText="ID" />
<asp:BoundField DataField="RoomTypeX" HeaderText="RoomType" />
<asp:BoundField DataField="RoomX" HeaderText="RoomX" />
<asp:BoundField DataField="Rate" HeaderText="Rate" DataFormatString="{0:f}" />
<asp:BoundField DataField="Adults" HeaderText="Adults" />
<asp:BoundField DataField="Children" HeaderText="Children" />
<asp:CommandField ShowDeleteButton="True" />
</Columns>
</asp:GridView>
</div>
<div style="float:left;"> <asp:Label ID="Label1" runat="server" Text="Total Charge : " Font-Bold="true" ForeColor ="Blue" style="font-size:19px;"></asp:Label><asp:Label ID="lblTotalAmount" runat="server" Text=""></asp:Label>
</div>
</ContentTemplate>
<Triggers>
<asp:PostBackTrigger ControlID="gvAddedRooms" />
<asp:PostBackTrigger ControlID="drpRoomtype" />
<asp:PostBackTrigger ControlID="drpPlan" />
<asp:PostBackTrigger ControlID="lnkAdd" />
<asp:PostBackTrigger ControlID="lstRooms" />
<asp:PostBackTrigger ControlID="drpAdults" />
<asp:PostBackTrigger ControlID="drpChildren" />
<asp:PostBackTrigger ControlID="btnRemoveFilename1" />
</Triggers>
</asp:UpdatePanel>
<%--<div class="formrow" style="text-align: right;">
<asp:UpdatePanel ID="UpdatePanel3" UpdateMode ="Conditional" runat="server">
<ContentTemplate >
Agency :
<asp:DropDownList ID="drpChannel" runat="server" Width="172px" AutoPostBack="True"
Height="32px" >
</asp:DropDownList>
</ContentTemplate>
<Triggers>
<asp:PostBackTrigger ControlID="drpChannel"
/>
<asp:AsyncPostBackTrigger ControlID="lnkNewChannel" EventName="Click" />
</Triggers>
</asp:UpdatePanel>
<asp:LinkButton ID="lnkNewChannel" runat="server" >New Channel</asp:LinkButton>
</div> --%>
<div class="newsubheadingsearchqueryresults" style="width: 685px;">
<h3>
Customer Details</h3>
<span class="requiredExample">[ * ] = Required Information</span></div>
<div class="formfieldset" style="margin-bottom: 40px;">
<div class="formrow">
<div class="paymentfrmlabels">
Paying Customer :</div>
<div class="paymentfrmtxtbox">
<asp:TextBox ID="txtCustomerName" Width="153px" runat="server"></asp:TextBox>
</div>
<div class="paymentfrmvalidation">
<asp:RegularExpressionValidator ID="RegularExpressionValidator2" runat="server" ControlToValidate="txtCustomerName"
ErrorMessage="[*]" ValidationExpression="^[a-zA-Z''-'\s]{1,40}$"
ValidationGroup="a" Display="Dynamic"></asp:RegularExpressionValidator>
<asp:RequiredFieldValidator ID="RequiredFieldValidator4" runat="server" ControlToValidate="txtCustomerName"
ValidationGroup="a" ErrorMessage="[*]" Display="Dynamic"></asp:RequiredFieldValidator>
</div>
</div>
<div class="formrow">
<div class="paymentfrmlabels">
Customer Type :</div>
<div class="paymentfrmtxtbox">
<asp:DropDownList ID="drpCustomerType" Width="153px" runat="server">
<asp:ListItem Text="Person" Value="Person"></asp:ListItem>
<asp:ListItem Text="Company" Value="Company"></asp:ListItem>
</asp:DropDownList>
</div>
</div>
<div class="formrow">
<div class="paymentfrmlabels">
E-Mail :
</div>
<div class="paymentfrmtxtbox">
<asp:TextBox ID="txtEmail" Width="153px" runat="server"></asp:TextBox>
</div>
<div class="paymentfrmvalidation">
</div>
</div>
<div class="formrow">
<div class="paymentfrmlabels">
Phone No :
</div>
<div class="paymentfrmtxtbox">
<asp:TextBox ID="txtPhone" runat="server" Height="23px" Width="153px"></asp:TextBox>
</div>
<div class="paymentfrmvalidation">
<asp:RegularExpressionValidator ID="RegularExpressionValidator4" runat="server" ErrorMessage="Invalid format"
Display="Dynamic" ValidationExpression="^[0-9]*$" ControlToValidate="txtPhone"
ValidationGroup="a"></asp:RegularExpressionValidator>
<asp:RequiredFieldValidator ID="RequiredFieldValidator6" runat="server" ControlToValidate="txtPhone"
Display="Dynamic" ValidationGroup="a" ErrorMessage="[*]"></asp:RequiredFieldValidator>
</div>
</div>
<div class="formrow" style="height: 130px;">
<div class="paymentfrmlabels">
Address:</div>
<div class="paymentfrmtxtbox">
<asp:TextBox ID="txtAddress" runat="server" Height="129px" TextMode="MultiLine" Width="153px"></asp:TextBox>
</div>
</div>
<div class="formrow">
<div class="paymentfrmlabels">
City :</div>
<div class="paymentfrmtxtbox">
<asp:TextBox ID="txtCity" runat="server" Width="153px"></asp:TextBox>
</div>
</div>
<div class="formrow">
<div class="paymentfrmlabels">
Country :</div>
<div class="paymentfrmtxtbox">
<asp:DropDownList ID="drpCountry" Width="153px" runat="server">
</asp:DropDownList>
</div>
</div>
<div class="formrow">
<div class="paymentfrmlabels">
State :</div>
<div class="paymentfrmtxtbox">
<asp:TextBox ID="txtState" Width="153px" runat="server"></asp:TextBox>
</div>
</div>
<div class="formrow">
<div class="paymentfrmlabels">
Postal Code :</div>
<div class="paymentfrmtxtbox">
<asp:TextBox ID="txtPostalCode" Width="153px" runat="server"></asp:TextBox>
</div>
</div>
<div class="formrow" style="height: 90px; width: 670px;">
<div class="paymentfrmlabels">
Other Guest Names :</div>
<div class="paymentfrmtxtbox" style="margin-right:45px;">
<asp:TextBox ID="txtOtherGuest" runat="server" Height="90px" Width="153px" TextMode="MultiLine"></asp:TextBox>
</div>
<div class="paymentfrmlabels">
Other Information:</div>
<div class="paymentfrmtxtbox">
<asp:TextBox ID="txtOtherInf" runat="server" Height="90px" Width="153px" TextMode="MultiLine"></asp:TextBox>
</div>
</div>
<div class="formrow" style="vertical-align: text-top;">
<div class="paymentfrmlabels">
Identity Proof :</div>
</div>
<div class="formrow">
<div class="paymentfrmtxtbox">
</div>
</div>
<div class="formrow" style="text-align: right">
<div class="paymentfrmlabels">
<input id="txtLogoFileName1" type="file" style ="float :left; z-index:999;" name="txtSmallImage1FileName" runat="server" />
<asp:UpdatePanel ID="UpdatePanel2" runat="server" ChildrenAsTriggers ="true" UpdateMode ="Conditional">
<ContentTemplate >
<div class="paymentfrmtxtbox">
<asp:Button ID="btnRemoveFilename1" runat="server" style="margin-left:50px; float :left; z-index:999;" Text="Remove" OnClick="btnRemoveFilename1_Click">
</asp:Button>
</div>
<asp:Label ID="lblLogoFileName1" runat="server" CssClass="labelText" ForeColor="Silver"> </asp:Label>
</div>
</ContentTemplate>
<Triggers >
<asp:PostBackTrigger ControlID ="btnRemoveFilename1" />
</Triggers>
</asp:UpdatePanel>
<div class="formrow" style="width: 300px;">
<div class="paymentfrmtxtbox ">
<asp:UpdatePanel ID="UpdatePanel3" UpdateMode ="Conditional" ChildrenAsTriggers ="true" runat="server">
<ContentTemplate >
Agency:
<asp:DropDownList ID="drpChannel" runat="server" Width="153px" AutoPostBack="True"
style=" float: right; height: 28px; margin-right: 65px;width: 157px;" >
</asp:DropDownList>
</ContentTemplate>
<Triggers>
<asp:PostBackTrigger ControlID="drpChannel"
/>
<asp:AsyncPostBackTrigger ControlID="lnkNewChannel" EventName="Click" />
</Triggers>
</asp:UpdatePanel>
<asp:LinkButton ID="lnkNewChannel" runat="server" style="display:block; float: right;margin-right: -71px; margin-top: 16px;" >New Channel</asp:LinkButton>
</div>
</div>
</div>
<div class="formrow" style="text-align: right; font-weight:bold; color:#000;">
</div>
<div class="formrow" style="text-align: right; width: 670px;">
<asp:LinkButton ID="lnkSubmit" CssClass="btn" runat="server" OnClick="lnkSubmit_Click1"
Width="65px" ValidationGroup="a">Check In</asp:LinkButton>
<asp:LinkButton ID="lnkCheckout" CssClass="btn" Width="65px" runat="server" OnClick="lnkCheckout_Click"
ValidationGroup="a">Check Out</asp:LinkButton>
<asp:LinkButton ID="lnkCancel" CssClass="btn" Width="65px" runat="server" OnClick="lnkCancel_Click1">Cancel</asp:LinkButton>
</div>
</div>
</div>
<ajaxtoolkit:ModalPopupExtender ID="ModalPopupExtender1" BackgroundCssClass="modalBackground" PopupControlID ="pnlChannel" TargetControlID ="lnkNewChannel" CancelControlID ="ImgBtnClose" runat="server">
</ajaxtoolkit:ModalPopupExtender>
<asp:Panel ID="pnlChannel" runat="server">
<div align="right" style ="padding-top :50px" >
<asp:ImageButton ID="ImgBtnClose" width="25px" Height ="25px" ImageUrl="~/Images/cross.png" runat="server" /></div>
<div style ="background-color:White ; border :20px; border-color:Blue;padding:20px 40px; border-radius:20px;" >
<style type="text/css">
.style1 {
width: 100%;
}
.style2
{
text-align: center;
font-weight: bold;
font-family: Andalus;
font-size: xx-large;
color: #434343;
}
.style3
{
width: 81px;
}
</style>
<div>
<table class="style1">
<tr>
<td class="style2" colspan="2">
Agency</td>
</tr>
<tr><td> </td><td> </td></tr>
<tr><td> </td><td> </td></tr>
<tr>
<td class="style3">
<asp:Label ID="lblName" runat="server" Text="Name:"></asp:Label>
</td>
<td>
<asp:TextBox ID="txtName" runat="server" Width="189px"></asp:TextBox>
<asp:RequiredFieldValidator ID="RequiredFieldValidator5" runat="server"
ControlToValidate="txtName" Display="Dynamic" ErrorMessage="Mandatory Field!!!"
ForeColor="Red" ValidationGroup="acssd23"></asp:RequiredFieldValidator>
<asp:RegularExpressionValidator ID="RegularExpressionValidator5" runat="server"
ControlToValidate="txtName" Display="Dynamic"
ErrorMessage="Invalid Name Format!!!" Font-Names="Arial" Font-Size="8pt"
ForeColor="Red" SetFocusOnError="True"
ValidationExpression="^[a-zA-Z-'.\s]{1,50}" ValidationGroup="acssd23"></asp:RegularExpressionValidator>
</td>
</tr>
<tr><td> </td><td> </td></tr>
<tr>
<td class="style3">
<asp:Label ID="lblContact" runat="server" Text="Contact:"></asp:Label>
</td>
<td>
<asp:TextBox ID="txtContact" runat="server" Width="189px"></asp:TextBox>
<asp:RequiredFieldValidator ID="RequiredFieldValidator7" runat="server"
ControlToValidate="txtContact" Display="Dynamic"
ErrorMessage="Mandatory Field!!!" ForeColor="Red"
ValidationGroup="acssd23"></asp:RequiredFieldValidator>
<asp:RegularExpressionValidator ID="RegularExpressionValidator1" runat="server"
ControlToValidate="txtContact" Display="Dynamic"
ErrorMessage="Invalid Contact Format!!!" ForeColor="Red"
style="font-size: xx-small" ValidationExpression="^[0-9-+]*$"
ValidationGroup="acssd23"></asp:RegularExpressionValidator>
</td>
</tr>
<tr><td> </td><td> </td></tr>
<tr>
<td class="style3">
<asp:Label ID="lblAddress" runat="server" Text="Address:"></asp:Label>
</td>
<td>
<asp:TextBox ID="txtAddresss" runat="server" Height="64px" TextMode="MultiLine"
width="189px"></asp:TextBox>
<asp:RequiredFieldValidator ID="RequiredFieldValidator8" runat="server"
ControlToValidate="txtAddresss" Display="Dynamic"
ErrorMessage="Mandatory Field!!!" ForeColor="Red"
ValidationGroup="acssd23"></asp:RequiredFieldValidator>
</td>
</tr>
<tr><td> </td><td> </td></tr>
<tr>
<td class="style3">
<asp:Label ID="lblEmail" runat="server" Text="Email:"></asp:Label>
</td>
<td>
<asp:TextBox ID="txtEmails" runat="server" Width="189px"></asp:TextBox>
<asp:RequiredFieldValidator ID="RequiredFieldValidator9" runat="server"
ControlToValidate="txtEmails" Display="Dynamic"
ErrorMessage="Mandatory Field!!!" ForeColor="Red"
ValidationGroup="acssd23"></asp:RequiredFieldValidator>
<asp:RegularExpressionValidator ID="RegularExpressionValidator015" runat="server"
ControlToValidate="txtEmail" ErrorMessage="Invalid Email Format!!!"
ForeColor="Red"
ValidationExpression="\w+([-+.']\w+)*#\w+([-.]\w+)*\.\w+([-.]\w+)*"
ValidationGroup="acssd23"></asp:RegularExpressionValidator>
</td>
</tr>
<tr><td> </td><td> </td></tr>
<tr>
<td class="style3">
<asp:Label ID="lblWebsite" runat="server" Text="Website:"></asp:Label>
</td>
<td>
<asp:TextBox ID="txtWebsite" runat="server" Width="189px"></asp:TextBox>
</td>
</tr>
<tr><td> </td><td> </td></tr>
<tr>
<td class="style3">
</td>
<td>
</td>
</tr>
<tr>
<td class="style3">
</td>
<td align ="right" >
<asp:Button ID="btnSubmit" CssClass="btn" Width ="140px" runat="server" Text="Submit"
onclick="btnSubmit_Click" style="height: 26px" ValidationGroup="acssd23" />
</td>
</tr>
</table>
</div>
</div>
</asp:Panel>
</asp:Panel>
<asp:ScriptManager ID="ScriptManager1" runat="server" EnablePartialRendering="true" />
<div>
<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="conditional">
<Triggers>
<asp:PostBackTrigger ControlID="Button1" />
</Triggers>
<ContentTemplate>
<asp:FileUpload ID="FileUpload1" runat="server" />
<asp:Button ID="Button1" runat="server"Text="Upload" OnClick="Button1_Click" />
</ContentTemplate>
</asp:UpdatePanel>
</div>
The default ASP.NET FileUpload control will never work with an UpdatePanel. You need a special AsyncFileUpload control as defined in an AjaxControl Toolkit.
<ajaxToolkit:AsyncFileUpload OnClientUploadError="uploadError"
OnClientUploadComplete="uploadComplete" runat="server"
ID="AsyncFileUpload1" Width="400px" UploaderStyle="Modern"
UploadingBackColor="#CCFFFF" ThrobberID="myThrobber" />
or you can use UpdatePanel Triggers
<Triggers>
<asp:PostBackTrigger ControlID="YourControlID" />
</Triggers>
I spent all afternoon on this today, using any number of solutions I found on various forums, including this one, CodeProject.com, asp.net forums, and a whole slew of others. I tried setting Postback triggers and AsyncPostback triggers, and this late at night I can't remember what all else. None of them worked, including the one marked as the answer on this page. What I finally found was an obscure post from 2007 on the asp.net forum which, for some reason now will not load on my browser. At any rate, what finally worked for me was replacing the
<form id="form1" runat="server>
tag with this:
<form id="Form1" method="post" enctype="multipart/form-data" runat="server">
Worked beautifully.
In my case it was in the Site.Master file, but in the case of the posting on forums.asp.net, it worked in a default.aspx file.
Update: The forums.asp.net site was down, but it's back up now: UpdatePanel + FileUpload + PostBackTrigger doesn't seem to work.
I have problem with this form submission, on button click this form straight goes to it's action, but first i want to validate the file upload and save the uploaded file.. but as soon as i click the submit button form goes to the action page.. Do you have any ideas why?
Here is the code:
<form action="" id="form2" class="appForm">
<asp:Repeater ID="Repeater1" runat="server">
<ItemTemplate>
<table class="jobTitleTbl" cellpadding="0" cellspacing="0" border="0">
<thead>
<tr>
<th>Job Title</th>
<th>Job Posting Reference</th>
<th>Type of Job</th>
<th>Job Department</th>
</tr>
</thead>
<ul class="jobHeadings">
<li class="jobPos"><%# Eval("JobPosition") %></li>
<li class="jobCat"><%# Eval("JobCategory") %></li>
<li class="jobDate"><%# Eval("Posted", "{0:MMMM d, yyyy}")%></li>
<li class="jobApplyDate"><%# Eval("ApplyBy", "{0:MMMM d, yyyy}")%></li>
</ul>
<%-- <tbody>
<td class="lftBorder"><%# Eval("JobPosition") %></td>
<td><%# Eval("JobCategory") %></td>
<td></td>
<td><%# Eval("ApplyBy") %></td>
</tr>
</tbody>--%>
</table>
</ItemTemplate>
</asp:Repeater>
<fieldset>
<legend>Salary</legend>
<div class="formFieldsLft">
<asp:TextBox ID="txtBoxCurSalary" runat="server" value="" placeholder="Current Salary" onblur="onBlur(this)" onfocus="onFocus(this)" />
</div>
<div class="formFieldsLft">
<asp:TextBox ID="txtBoxExpSalary" runat="server" placeholder="Expected Salary" value="" onblur="onBlur(this)" onfocus="onFocus(this)" />
</div>
</fieldset>
<fieldset>
<legend>Notice Period</legend>
<div class="formFieldsLft">
<asp:TextBox runat="server" ID="txtboxNoticePeriod" value="Notice Period Required for Joining" onblur="onBlur(this)" onfocus="onFocus(this)" />
</div>
<div class="formFieldsLft">
<asp:TextBox runat="server" ID="txtBoxExpecjoinDate" value="Expected Date of Joining" onblur="onBlur(this)" onfocus="onFocus(this)" />
</div>
</fieldset>
<fieldset>
<legend>Personal Details</legend>
<div class="formFieldsLft">
<asp:TextBox runat="server" ID="txtBoxPerName" value="Name" onblur="onBlur(this)" onfocus="onFocus(this)" />
</div>
<div class="formFieldsLft">
<asp:TextBox runat="server" ID="TxtBoxFatherName" value="Father's Name" onblur="onBlur(this)" onfocus="onFocus(this)" />
</div>
<div class="formFieldsLft">
<label class="idCardLbl floatLft">CNIC#</label><asp:TextBox runat="server" class="" id="txtBoxidCard" type="text" value="99999-9999999-9" />
</div>
<div class="formFieldsLft">
<asp:TextBox runat="server" class="" type="text" value="Family Code" maxlength="6" onblur="onBlur(this)" onfocus="onFocus(this)" />
</div>
<div class="formFldsFull">
<asp:TextBox runat="server" class="smallFld" ID="txtBoxPhone" value="Phone" onblur="onBlur(this)" onfocus="onFocus(this)" />
<asp:TextBox runat="server" class="smallFld" ID="txtBoxMobile" value="Mobile" onblur="onBlur(this)" onfocus="onFocus(this)" />
<asp:TextBox runat="server" class="smallFld" ID="txtBoxEmail" value="Email" onblur="onBlur(this)" onfocus="onFocus(this)" />
</div>
<hr class="formDivider" />
<h3 class=" fullwidth">Upload Your CV</h3>
<div class="formFldsFull">
<input type="file" />
</div>
<asp:Button runat="server" ID="ButtonSubmit" CommandName="Apply" Class="btns btnRed floatLft"
Text="Submit"
oncommand="ButtonSubmit_Command" UseSubmitBehavior="False" />
</form>
I have a form with 4 dropdownlists whose autopostback property is set to true and each dropdown list gets populated based on the selection of the previous dropdownlist.
Ex. ddlCourseType gets populated after a selection is made in ddlCourseLevel and so on.
I need to validate every textbox and dropdownlist but am having a hard time with the dropdownlists because of its autopostback property.
It will be great if somebody could help me with the best way to validate this form or any tips or advice would be awesome. Thanks a lot. Below is the aspx file that has the jquery function for validating dropdowns and textboxes.
Admin_Course_Edit.aspx
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
<script src="/JQuery_Plugins/timepicker/js/jquery-ui-1.7.2.custom.min.js" type="text/javascript"></script>
<link href="../JQuery_Plugins/timepicker/css/ui-lightness/jquery-ui-1.7.2.custom.css"
rel="stylesheet" type="text/css" />
<script type="text/javascript">
$(function () {
$('#tbStartDate').datepicker({
duration: '',
showTime: true,
constrainInput: false
});
});
</script>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="BreadCrumbs" runat="server">
<asp:SiteMapPath ID="SiteMapPath1" runat="server">
</asp:SiteMapPath>
</asp:Content>
<asp:Content ID="Content3" ContentPlaceHolderID="rightNavigation" runat="server">
<script type="text/javascript">
$(document).ready(function () {
//Function to Validate DatePicker
$.validator.addMethod('isDate', function (value, element) {
var isDate = false;
try {
$.datepicker.parseDate('mm/dd/yy', value);
isDate = true;
}
catch (e) {
}
return isDate;
});
//Function to Validate DropDown Lists
$.validator.addMethod('selectNone',
function (value, element) {
return this.optional(element) ||
(value.indexOf("") == -1); //Leave it blank or enter the exact text in index 0
}, "Please Select an Option");
$("#form1").validate({
// $("#tbStartDate").rules("add", {isDate: true} messages: {isDate: "Date to Validate is invalid."}
rules: {
'<%=ddlCourseLevel.UniqueID %>': { selectNone: true },
'<%=tbStartDate.UniqueID %>': { required: true, isDate: true },
'<%=tbCourseName.UniqueID %>': { required: true, maxlength: 25 },
'<%=tbPointScale.UniqueID %>': { required: true, digits: true },
'<%=tbDescription.UniqueID %>': { maxlength: 50 }
},
messages: { '<%=tbStartDate.UniqueID %>': { isDate: "Please enter a Valid Date"} }
});
$("#imgBtn_A_save").click(function (evt) {
// Validate the form and retain the result.
var isValid = $("#form1").valid();
// If the form didn't validate, prevent the
// form submission.
if (!isValid)
evt.preventDefault();
});
$("#imgBtn_A_cancel").click(function () {
$("#form1").validate().cancelSubmit = true;
});
});
function HideLabel() {
document.getElementById('<%= lblMessage.ClientID %>').style.display = "none";
}
setTimeout("HideLabel();", 2000);
</script>
<div class="Admin_rightNavtop">
<div class="title">
<asp:Label ID="lblTitle" Text="Edit Course" runat="server" class="titleLbl" />
</div>
<p align="center">
<asp:Label ID="lblMessage" runat="server" Style="color: Red" /></p>
<!-- START TABLE ADD FORM-->
<table style="margin-left: 70px">
<tr>
<td>
<asp:Label ID="LblCourseLevel" Text="* Course Level :" runat="server" class="lblSize_largeGreen" />
</td>
<td>
<asp:DropDownList ID="ddlCourseLevel" class="ddlSize_large_addEdit" OnSelectedIndexChanged="ddlCourseLevel_SelectedIndexChanged"
AutoPostBack="true" EnableViewState="true" OnDataBound="helperCourseLevel_Databound"
runat="server" />
</td>
</tr>
<tr>
<td>
<asp:Label ID="CourseType" Text="* Course Type :" runat="server" class="lblSize_largeGreen" />
</td>
<td>
<asp:DropDownList ID="ddlCourseType" runat="server" class="ddlSize_large_addEdit"
OnDataBound="helperCourseType_Databound" EnableViewState="true" OnSelectedIndexChanged="ddlCourseType_SelectedIndexChanged"
AutoPostBack="true" />
</td>
</tr>
<tr>
<td>
<asp:Label ID="lblCourseName" Text="* Course Name :" runat="server" class="lblSize_largeGreen" />
</td>
<td>
<asp:DropDownList ID="ddlCourseName" class="ddlSize_large_addEdit" OnSelectedIndexChanged="ddlCourseName_SelectedIndexChanged"
AutoPostBack="true" EnableViewState="true" OnDataBound="helperCourse_Databound"
runat="server" />
</td>
</tr>
<tr>
<td>
<asp:Label ID="lblCourseName2" Text="* New Name :" runat="server" class="lblSize_largeGreen" />
</td>
<td>
<asp:TextBox ID="tbCourseName" class="tbSize_large_addEdit" runat="server" />
</td>
</tr>
<tr>
<td>
<asp:Label ID="lblStartDate" Text="* Start Date :" runat="server" class="lblSize_largeGreen" />
</td>
<td>
<asp:TextBox ID="tbStartDate" runat="server" class="tbSize_large_addEdit" />
</td>
</tr>
<tr>
<td>
<asp:Label ID="lblGraded" Text="* Grade Type :" runat="server" class="lblSize_largeGreen" />
</td>
<td>
<asp:DropDownList ID="ddlGradeType" runat="server" class="ddlSize_large_addEdit"
OnSelectedIndexChanged="ddlGradeType_SelectedIndexChanged" AutoPostBack="true">
<asp:ListItem>---Select Grade Type---</asp:ListItem>
<asp:ListItem Value="1">Point Scale</asp:ListItem>
<asp:ListItem Value="2">Pass/Fail</asp:ListItem>
<asp:ListItem Value="3">Attendance</asp:ListItem>
<asp:ListItem Value="4">Not Graded</asp:ListItem>
</asp:DropDownList>
</td>
</tr>
<tr>
<td>
<asp:Label ID="lblPointScale" Text="* Point Scale :" runat="server" class="lblSize_largeGreen"
Visible="false" />
</td>
<td>
<asp:TextBox ID="tbPointScale" runat="server" class="tbSize_large_addEdit" Visible="false" />
</td>
</tr>
<tr>
<td>
<asp:Label ID="lblDescription" Text="Description :" runat="server" class="lblSize_largeGreen" />
</td>
<td>
<asp:TextBox ID="tbDescription" runat="server" class="tbSize_large_addEdit" />
</td>
</tr>
</table>
<!-- End of Table ADD COURSE-->
</div>
<!-- End of rightNavTop-->
<center>
<div class="Admin_action">
<asp:ImageButton ID="imgBtn_A_save" ImageUrl="../Images/Save.png" OnClick="save_Click"
runat="server" class="Admin_action_imgSize_small" />
<asp:ImageButton ID="imgBtn_A_cancel" ImageUrl="../Images/Cancel.png" runat="server"
class="Admin_action_imgSize_small" CausesValidation="false" OnClick="cancel_Click" />
</div>
</center>
<!-- End selection buttons-->
</asp:Content>
You can add an onchange event to the control and return false if you think it's invalid to cancel the postback.
Personally, I'd want to do the whole shebang using jQuery and AJAX and cut out the nasty auto postback.
The validations for the dependent DDLs will also have to check their "parent" DDL.
DDL 1 - Must be selected
DDL 2 - If DDL 1 is selected must be selected.
DDL 3 - If DDL 2 is selected must be selected.
DDL 4 - If DDL 4 is selected must be selected.
Sorry I don't have time to write up the code, but hopefully this will be helpful.