表單提交驗證動態下拉列表

Question

我有一個顯示帶有下拉菜單的動態行數的表單。 每個下拉列表的ID為“ ReasonCd＃”，並且末尾的數字從0開始遞增-相應地增加行號。 每個下拉列表都有一個默認選擇“選擇數字”，其值為NULL。

我想在表單中添加提交驗證。 如何提醒用戶是否有動態下拉列表中的默認選項被選中？

 <select id='ReasonCd" . $counter . "'> <option disabled='disabled' selected='selected' value=''>Select Number</option> <option>blah</option> </select> 

我試圖創建自己的jQuery，但不幸的是我無法使它正常工作。

（單擊我的提交按鈕時）

 $("#submitButton").click(function() { $('[id^=ReasonCd]').filter(function(){ if($(this).text() == "Select Number"){ alert('Please Select a Number!!!'); } }); 

}）;

Answer 1

檢查選擇的選項：

    $("#submitButton").click(function(e) {
        $('[id^=ReasonCd] option:selected').filter(function(){
        if($(this).text() == "Select Number"){
            alert('Please Select a Number!!!');
            e.preventDefault(); //cancel postback
            return false; //exit of .filter

        }
       });
    });

要么：

$('form').submit(function(e) {
    $('[id^=ReasonCd] option:selected').each(function(){
    if($(this).text() == "Select Number"){
        alert('Please Select a Number!!!');
        e.preventDefault();
        return false;
    }
});
});

有多個下拉菜單

現場演示更新

Answer 2

這是完整的工作演示

您需要遍歷每個下拉列表中所有ID為^=ReasonCd選項，並在找到的第一個無效(selectedopts.eq(i).text() == 'Select Number')返回false。

注意：返回范圍必須是提交功能

$("#submitButton").click(function()
{
    selectedopts = $('[id^=ReasonCd] option:selected');
    for(i=0;i<selectedopts.length;i++)
    {
        if(selectedopts.eq(i).text() == 'Select Number')
        {
            alert('Please Select a Number!!!');
            return false;
        }
    }
});