Dfyjkt

I have a page that allows user to select desired schedule to run a task.

Users can select multiple schedules. e.g. Daily + Weekly

Condition:
If Weekly checkbox is ticked, Select Day of Week must have at least 1 day selection.

var divDay = document.getElementById("divSelectDay");
var execSch = document.getElementById("ddlExecutionSchedule");

var checkbox = execSch.getElementsByTagName("input");
var counter = 0;
for (var i = 0; i < checkbox.length; i++) 
 if (checkbox[i].checked) 
 if (checkbox[i].value == "Weekly")
 divDay.style.display = 'block';
 
 else 
 if (checkbox[i].value == "Weekly") 
 divDay.style.display = 'none';
 
 


function ShowCheckBox(ddlId) 
 var ControlName = document.getElementById(ddlId.id);
 var day = document.getElementById("divSelectDay");

 if (ControlName.value == "Weekly") 
 
 day.style.display = 'block';
 dat.style.display = 'none';
 
 else 
 day.style.display = 'none';
 dat.style.display = 'none';
 


// Toggles Weekly (Day) execution schedule.
function ToggleExecutionSchedule(controlId) 
 var frmControl = document.getElementById(controlId.id);
 var divDay = document.getElementById("divSelectDay");

 var checkbox = frmControl.getElementsByTagName("input");
 var counter = 0;
 for (var i = 0; i < checkbox.length; i++) 
 if (checkbox[i].checked)
 
 if (checkbox[i].value == "Weekly")
 divDay.style.display = 'block';
 
 else
 
 if (checkbox[i].value == "Weekly") 
 divDay.style.display = 'none';
 
 
 

On the same .ascx page, I have a SAVE button that validates the page input:

function SaveGroupCheck() {
 var isValid = true;
 var haveError = false;

 var schedule = document.getElementById("<%=ddlExecutionSchedule.ClientID%>").value;
 if (schedule == "Weekly")
 
 var xday = document.getElementById("<%=chkSelectDay.ClientID%>");
 var checkbox = xday.getElementsByTagName("input");
 var counter = 0;
 for (var i = 0; i < checkbox.length; i++) 
 if (checkbox[i].checked) 
 counter++;
 
 

 if (counter < 1) 
 $("#chkSelectDay").addClass('errorbox');
 $("#divSelectDay").addClass('has-error has-feedback');
 $("#lblSelectDay").addClass('has-error has-feedback');
 haveError = true;
 
 else 
 $("#chkSelectDay").removeClass('errorbox');
 $("#divSelectDay").removeClass('has-error has-feedback');
 $("#lblSelectDay").removeClass('has-error has-feedback');
 
 

 if (!isValid || !haveError) 
 document.getElementById("<%=txtCheckPostback.ClientID%>").value = "Save";
 waitingDialog.show('Saving Changes...');
 __doPostBack();

 
 else 
 waitingDialog.hide();
 showErrorPopup("Please enter required information for all highlighted fields");
 

Right now, my SAVE button allows the settings to be saved when user ticks Weekly without Select Day of Week selected.

May I know what did I miss? Thank you for your time.

HTML:

<div class="form-group" id="divExecutionSchedule">
 <label class="control-label col-md-2" id="lblExecutionSchedule">Execution Schedule</label>
 <div class="col-md-3">
 <div class="input-group">
 <asp:CheckboxList ID="ddlExecutionSchedule" ClientIDMode="Static" CssClass="chkLabel" runat="server" AutoPostBack="false" CellPadding="5" CellSpacing="5" RepeatDirection="Horizontal" RepeatLayout="Table" onchange="ToggleExecutionSchedule(this)" >
 <asp:ListItem Text="Daily" Value="Daily"></asp:ListItem>
 <asp:ListItem Text="Weekly" Value="Weekly"></asp:ListItem>
 </asp:CheckboxList>
 </div>
 </div>
 <label class="control-label col-md-2"></label>
 <div class="col-md-10">
 <div class="alert alert-danger hidden" role="alert" id="executionScheduleError"></div>
 </div>
</div>

<div class="form-group" id="divSelectDay" >
 <label class="control-label col-md-2" id="lblSelectDay">Select Day of Week</label>
 <div class="col-md-3">
 <div class="input-group">
 <asp:CheckBoxList ID="chkSelectDay" CssClass="chkLabel" ClientIDMode="Static" runat="server" AutoPostBack="false" CellPadding="5" CellSpacing="5" RepeatDirection="Horizontal" RepeatLayout="Table"> 
 <asp:ListItem Value="Monday">Mon</asp:ListItem>
 <asp:ListItem Value="Tuesday">Tue</asp:ListItem>
 <asp:ListItem Value="Wednesday">Wed</asp:ListItem>
 <asp:ListItem Value="Thursday">Thu</asp:ListItem>
 <asp:ListItem Value="Friday">Fri</asp:ListItem>
 <asp:ListItem Value="Saturday">Sat</asp:ListItem>
 <asp:ListItem Value="Sunday">Sun</asp:ListItem>
 </asp:CheckBoxList>
 </div>
 </div>
 <label class="control-label col-md-2"></label>
 <div class="col-md-10">
 <div class="alert alert-danger hidden" role="alert" id="selectDayError"></div>
 </div>
</div>

<div class="text-right">
 <button id="btnSave" class="btn btn-success btn-md" onclick="return preSave();"><span class="fa fa-floppy-o" aria-hidden="true"></span>Save</button>
</div>