Reputation: 3
I am trying to ensure that one drop down box or the other drop down box has a chosen entry, not both and both can not be left empty/ unchosen. Every time I click the search button, which runs the javascript validation code, I get the message as if I have chosen within both drop down boxes, even if I have only chosen from one, or even if I have not chosen from either! This could be my logic, however, I think that it could also be that my variables are reading null. Does anybody have any thoughts on what the problem could be and how I might fix it?
Javascript: function userValid() {
var Season = document.getElementById('<%=cboMonth.ClientID %>');
var Month = document.getElementById('<%=lboChosenSeason.ClientID %>');
var Day = document.getElementById('<%=cboDay.ClientID %>');
if (Season == 'none' && Month == 0) {
alert("A Season OR a Month is required.");
return false;
}
if (Season != 'none' && Month != 0) {
alert("Please select either a season OR a month.");
return false;
}
else {
return true;
}
}
ASP.NET
<%@ Page Language="C#" Title="Search for a class by date"
MasterPageFile="~/Site.master"
AutoEventWireup="true"
CodeBehind="SearchByDate.aspx.cs"
Inherits="ClassesnWorkshops.SearchByDate" %>
<asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent">
<script src="UserValidation.js" type="text/javascript"></script>
</asp:Content>
<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">
<div align="center" style="background-color: transparent; background-image: url(Images/panel-SearchByDate.png); height: 265px; background-repeat:no-repeat; background-position: 50% 50%;">
<div style="height: 100%; padding-left: 1%">
<br />
<asp:ImageMap ID="ImageMap1" runat="server" ImageUrl="Images/hotspot.gif" ForeColor="Black" Height="16px" Width="605px">
<asp:RectangleHotSpot AlternateText="Search By Keyword" Left="0" Top="15" Right="75" Bottom="0" NavigateUrl="~/Default.aspx" />
<asp:RectangleHotSpot AlternateText="Search By Age" Left="100" Top="20" Right="185" Bottom="0" NavigateUrl="~/SearchByAge.aspx" />
<asp:RectangleHotSpot AlternateText="Search By Price" Left="200" Top="25" Right="290" Bottom="0" NavigateUrl="~/SearchByPrice.aspx" />
<asp:RectangleHotSpot AlternateText="Search By Date" Left="310" Top="30" Right="395" Bottom="0" NavigateUrl="~/SearchByDate.aspx" />
<asp:RectangleHotSpot AlternateText="Search By Class Type" Left="410" Top="35" Right="505" Bottom="0" NavigateUrl="~/SearchByType.aspx" />
<asp:RectangleHotSpot AlternateText="Advanced Search" Left="520" Top="25" Right="605" Bottom="0" NavigateUrl="~/AdvSearch.aspx" />
</asp:ImageMap>
<br />
<br />
<asp:Label ID="lblDate" runat="server" Text="Choose a year and season or month for the start of your class: " ForeColor="Black"></asp:Label>
<br /><br />
<asp:Label ID="lblYear" runat="server" Text="Year: " ForeColor="Black"></asp:Label>
<asp:DropDownList ID="cboYear" runat="server" width="60px" tooltip="Choose a year for classes.">
</asp:DropDownList>
<asp:Label ID="lblSeason" runat="server" Text="Season: " ForeColor="Black"></asp:Label>
<asp:ListBox ID="lboSeason" runat="server" Rows="1" class="cSeason"
onselectedindexchanged="lboSeason_SelectedIndexChanged">
<asp:ListItem>none</asp:ListItem>
<asp:ListItem>Spring 1</asp:ListItem>
<asp:ListItem>Spring 2</asp:ListItem>
<asp:ListItem>Summer 1</asp:ListItem>
<asp:ListItem>Summer 2</asp:ListItem>
<asp:ListItem>Fall 1</asp:ListItem>
<asp:ListItem>Fall 2</asp:ListItem>
</asp:ListBox>
<asp:Label ID="lblOR" runat="server" Text=" OR " ForeColor="Black"></asp:Label>
<asp:Label ID="lblMonth" runat="server" Text="Month: " ForeColor="Black"></asp:Label>
<asp:ListBox ID="cboMonth" runat="server" Rows="1">
<asp:ListItem>0</asp:ListItem>
<asp:ListItem>1</asp:ListItem>
<asp:ListItem>2</asp:ListItem>
<asp:ListItem>3</asp:ListItem>
<asp:ListItem>4</asp:ListItem>
<asp:ListItem>5</asp:ListItem>
<asp:ListItem>6</asp:ListItem>
<asp:ListItem>7</asp:ListItem>
<asp:ListItem>8</asp:ListItem>
<asp:ListItem>9</asp:ListItem>
<asp:ListItem>10</asp:ListItem>
<asp:ListItem>11</asp:ListItem>
<asp:ListItem>12</asp:ListItem>
</asp:ListBox>
Optional Day:
<asp:DropDownList ID="cboDay" runat="server" width="50px" tooltip="Choose minimum cost of class or group of classes.">
</asp:DropDownList>
<br />
<br />
<asp:Label ID="lblSearch" runat="server" Text="Search: " ForeColor="Black"></asp:Label>
<asp:TextBox ID="txtSearchWords" runat="server" Width="250px" tooltip="Place a keyword such as subject, category or title."></asp:TextBox>
<br />
<br />
<asp:Label ID="lblZipCode" runat="server" Text="Zipcode: " ForeColor="Black"></asp:Label>
<asp:TextBox ID="txtZipCode" runat="server" Width="80px" tooltip="Type your 5 digit zipcode as a center point for a distance search."></asp:TextBox>
<asp:Label ID="lblDistance" runat="server" Text="Distance: " ForeColor="Black"></asp:Label>
<asp:DropDownList ID="cboWithin" runat="server" width="100px" tooltip="Choose the miles your are willing to travel to your class.">
</asp:DropDownList>
<br />
<br />
<asp:Button ID="cmdSearch" runat="server" Text="Search" onclick="cmdSearch_Click" OnClientClick="return userValid();" />
<asp:Label ID="lblChosenSeason" runat="server" Text="Label"></asp:Label>
<br />
Upvotes: 0
Views: 645
Reputation: 56
You're using the element variables as their values. You need to use the values.
if (Season.value == 'none' && Month.selectedIndex == 0) {
alert("A Season OR a Month is required.");
return false;
}
as opposed to:
if (Season == 'none' && Month == 0) {
alert("A Season OR a Month is required.");
return false;
}
Upvotes: 1