表单提交验证动态#下拉列表

时间:2014-04-19 20:54:31

标签: javascript php jquery html forms

我有一个表单,显示带有下拉列表的动态行数。每个下拉列表的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!!!');
    }
});
     

});

2 个答案:

答案 0 :(得分: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;
    }
});
});

With multiple dropdowns

Live Demo Update

答案 1 :(得分:0)

Here is complete working demo

您需要遍历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;
        }
    }
});