目标:
如果单选按钮" .... date(s)"如果选中,则不会禁用开始日期和结束日期的下拉列表。
问题:
当您选择并选中了单选按钮" .... date(s)"然后按搜索按钮。
单选按钮" ....日期"已选中但开始日期和结束日期的下拉列表已禁用。
如果" .... date(s)"如何启用以使下拉列表处于活动状态?按下搜索或提交按钮后检查?
信息:
*如果选中单选按钮"全部...仅#34;,应禁用开始和结束日期的下拉列表。
*我正在使用boostrap,jquery。 asp.net mvc CSHTML:
Search for
@Html.RadioButtonFor(x => x.SelectionOfInputRadio, "all", new { id = "test", @class = "positionRadio test-or-dates", @checked = "checked" })
<label for="all" class="labelPositionForRadio">All ... only</label>
@Html.RadioButtonFor(x => x.SelectionOfInputRadio, "dates", new { id = "dates", @class = "positionRadio test-or-dates" })
<label for="dates" class="labelPositionForRadio">date(s)</label>
@{
DateTime myDate = DateTime.Today;
List<SelectListItem> myListSelectListItem_YearStartDate = new List<SelectListItem>();
for (int i = 0; i < 10; i++)
{
myListSelectListItem_YearStartDate.Add(new SelectListItem { Text = (myDate.Year - i).ToString(), Value = (myDate.Year - i).ToString(), Selected = DateTime.Today.Year == (myDate.Year - i) ? true : false });
}
}
@Html.DropDownList("YearStartDate", myListSelectListItem_YearStartDate, new { @class = "date-selector", @disabled = "disabled" })
@Html.DropDownList("YearEndDate", myListSelectListItem_YearStartDate, new { @class = "date-selector", @disabled = "disabled" })
@{
List<SelectListItem> mySelectListItem_month = new List<SelectListItem>();
mySelectListItem_month.Add(new SelectListItem { Text = "January", Value = "01", Selected = DateTime.Today.Month == 1 ? true : false });
mySelectListItem_month.Add(new SelectListItem { Text = "February", Value = "02", Selected = DateTime.Today.Month == 2 ? true : false });
mySelectListItem_month.Add(new SelectListItem { Text = "March", Value = "03", Selected = DateTime.Today.Month == 3 ? true : false });
mySelectListItem_month.Add(new SelectListItem { Text = "April", Value = "04", Selected = DateTime.Today.Month == 4 ? true : false });
mySelectListItem_month.Add(new SelectListItem { Text = "May", Value = "05", Selected = DateTime.Today.Month == 5 ? true : false });
mySelectListItem_month.Add(new SelectListItem { Text = "June", Value = "06", Selected = DateTime.Today.Month == 6 ? true : false });
mySelectListItem_month.Add(new SelectListItem { Text = "July", Value = "07", Selected = DateTime.Today.Month == 7 ? true : false });
mySelectListItem_month.Add(new SelectListItem { Text = "August", Value = "08", Selected = DateTime.Today.Month == 8 ? true : false });
mySelectListItem_month.Add(new SelectListItem { Text = "September", Value = "09", Selected = DateTime.Today.Month == 9 ? true : false });
mySelectListItem_month.Add(new SelectListItem { Text = "October", Value = "10", Selected = DateTime.Today.Month == 10 ? true : false });
mySelectListItem_month.Add(new SelectListItem { Text = "November", Value = "11", Selected = DateTime.Today.Month == 11 ? true : false });
mySelectListItem_month.Add(new SelectListItem { Text = "December", Value = "12", Selected = DateTime.Today.Month == 12 ? true : false });
}
@Html.DropDownList("MonthStartDate", mySelectListItem_month, new { @class = "date-selector", @disabled = "disabled" })
@Html.DropDownList("MonthEndDate", mySelectListItem_month, new { @class = "date-selector", @disabled = "disabled" })
@{
List<SelectListItem> myListSelectListItem_startdate = new List<SelectListItem>();
for (int i = 1; i <= 31; i++)
{
SelectListItem mySelectListItem_startdate = new SelectListItem();
mySelectListItem_startdate.Text = i.ToString();
mySelectListItem_startdate.Value = i.ToString();
mySelectListItem_startdate.Selected = i.ToString() == DateTime.Today.Day.ToString() ? true : false;
myListSelectListItem_startdate.Add(mySelectListItem_startdate);
}
}
@Html.DropDownList("DayStartDate", myListSelectListItem_startdate, new { @class = "date-selector", @disabled = "disabled" })
@Html.DropDownList("DayEndDate", myListSelectListItem_startdate, new { @class = "date-selector", @disabled = "disabled" })
<input type="submit" value="Search" />
的Javascript
<script>
$('.test-or-dates').on('click', function () {
var _this = $(this);
var dateSelectors = $('.date-selector');
if (_this.attr('id') == 'all') {
dateSelectors.attr('disabled', true);
}
else {
dateSelectors.attr('disabled', false);
}
});
</script>