Javascript 用户为DropDownList选择值时强制提交，除非该值为自定义值

我希望在用户选择DropDownList的值时强制提交，只要它不是“自定义”的。如果是“自定义”，我不希望提交表单。相反，我想有开始日期和结束日期显示。但是，我不希望显示开始日期或结束日期，除非选择了“自定义”。我认为这必须通过jQuery或JavaScript来完成。有人能告诉我如何做到这一点吗

以下是控制器中的代码，用于将下拉列表的开始日期、结束日期和列表传递到视图：

List<SelectListItem> rangeList = new List<SelectListItem>();
rangeList.Add(new SelectListItem { Text = "Today", Value = "Today" });
rangeList.Add(new SelectListItem { Text = "Yesterday", Value = "Yesterday" });
rangeList.Add(new SelectListItem { Text = "Past 7 Days", Value = "Past 7 Days" });
rangeList.Add(new SelectListItem { Text = "Past 30 Days", Value = "Past 30 Days" });
rangeList.Add(new SelectListItem { Text = "Last Month", Value = "Last Month" });
rangeList.Add(new SelectListItem { Text = "Custom", Value = "Custom" });

ViewBag.rangeList = rangeList;
ViewBag.startingDate = startingDate;
ViewBag.endingDate = endingDate;
ViewBag.specifiedRange = specifiedRange;

编辑

我修改了代码以显示添加脚本的尝试。下面是我现在视图中的代码。它什么也没做

<script type="text/javascript">
    $("#range").change(function () 
    {
        if ($(this).val() == "Custom") 
        {
            $("p.down").toggle();
        }
        else 
        {
            $("form").submit();
        }
    });
</script>

@using (Html.BeginForm())
{
    <p>
        @Html.DropDownList("specifiedRange", new SelectList(
                    ViewBag.rangeList as System.Collections.IEnumerable, 
                    "Text", 
                    "Value", 
                    new { @Id = "range" }))
    </p>
    <p class = "down">
        Starting Date: @(Html.Telerik().DateTimePicker().Name("startingDate")) 
        Ending Date: @(Html.Telerik().DateTimePicker().Name("endingDate"))
        <input type="submit" value="GO" />
    </p>
}

---

这就是你要找的吗

$('#specifiedRange').change(function() {
    if($(this).val() !== 'Custom') $(this).closest('form').submit();
})

---

是的，它需要使用jquery完成。类似于这样：

$(document).ready(function(){
    $("#idofyourdropdown").change(function(){
       if($(this).val() == "Custom")
       {
        $("p.down").toggle();
       }
        else{
       $("form").submit();
    }

    });
});

---

然后把你想展示的分类

像这样自动提交表单对screenreader用户来说真的很不友好。我对jquery或javascript一无所知。我把你的密码放在哪里？它是否直接在视图中？您需要下载jquery库，在html中引用它，然后将其放入脚本标记中。一切都在这里：jquery.comBut既然您在mvc3上，一切都应该已经在那里了。你只要把我给你的代码放在这个脚本里就行了。我修改了这个问题来说明我做了什么。如果我为下拉列表选择一个值，它不会做任何事情。从浏览器查看源代码时，我注意到脚本位于页面主体中。这是个问题吗？\n我应用了你的更新，但仍然一无所获。脚本放在页面主体内是否重要？