Using Javascript to validate asp.net c# controls based on another controls entry

Question

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 />
           &nbsp; &nbsp;
            <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> &nbsp; &nbsp; &nbsp;
           <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>

           &nbsp; &nbsp; &nbsp; &nbsp; 
<asp:Label ID="lblOR" runat="server" Text=" OR " ForeColor="Black"></asp:Label>
            &nbsp; 
           <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>

           &nbsp; Optional Day:
           <asp:DropDownList ID="cboDay" runat="server" width="50px" tooltip="Choose minimum cost of class or group of classes.">
           </asp:DropDownList>
           <br />
           &nbsp; &nbsp; &nbsp;           
           <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>
                &nbsp;&nbsp;&nbsp; 
            <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();" />                
                &nbsp; &nbsp; 
<asp:Label ID="lblChosenSeason" runat="server" Text="Label"></asp:Label>
                <br />

Robbie Boucher · Accepted Answer · 2014-07-09 19:12:20Z

1

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;
}

answered Jul 9, 2014 at 19:12

Robbie Boucher

563 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Using Javascript to validate asp.net c# controls based on another controls entry

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related