禁用“提交”按钮,直到选中所有字段

时间:2013-05-15 16:59:38

标签: jquery jsp

在这部分代码中,我们需要禁用提交按钮,直到选中所有字段,否则每件事都搞砸了!那么可以禁用提交按钮吗?如果这样善意帮助我们!!

           out.println("<html><body><form action=''>");
            out.println("<br><center><h1><font color='red'>Detailed DocID Status</font></h1>");
            out.println("<br> Year <select name='year'>");
            out.println("<option value=''>Select Year</option>");

            for(int i=2010;i<=2020;i++){
                out.println("<option value="+i+">"+i+"</option>");
            }
                out.println("</select>");

            out.println(" &nbsp;&nbsp;&nbsp; Month <select name='month'>");

                out.println("<option value=''>Select Month</option>");
                out.println("<option value='01'>Jan</option>");
                out.println("<option value='02'>Feb</option>");
                out.println("<option value='03'>Mar</option>");
                out.println("<option value='04'>Apr</option>");
                out.println("<option value='05'>May</option>");
                out.println("<option value='06'>June</option>");
                out.println("<option value='07'>July</option>");
                out.println("<option value='08'>Aug</option>");
                out.println("<option value='09'>Sep</option>");
                out.println("<option value='10'>Oct</option>");
                out.println("<option value='11'>Nov</option>");
                out.println("<option value='12'>Dec</option>");

                out.println("</select>");

            out.println(" &nbsp;&nbsp;&nbsp; Status : <select name='status'><option value='Select Status'>Select Status</option><option value='Approved'>Approved</option><option value='Clarifications'>Clarifications</option><option value='Pending'>Pending</option></select> &nbsp;&nbsp;&nbsp; ");
            out.println("<input type='submit'id='submit' name='subBtn' value='Submit' disable='disabled' onClick=doenable()>");
            out.println("</form></body></html>");
            out.println("<br><br>");

我们尝试的功能

 function doenable()
        {
            if(document.getElementById("year")!=null)
            {
                if(document.getElementById("month")!=null)
                    {
                        if(document.getElementById("status")!=null)
                            {
                                document.getElementById("subBtn").disabled=false;
                            }
                    }

              }

        }

2 个答案:

答案 0 :(得分:1)

$("select").change(function() {
    if ($("select").filter(function () {
       return $(this).value == "";
    }).length == 0) {
     jQuery('#submit').removeAttr('disabled');
} else {
     jQuery('#submit').attr('disabled','disabled');
}

在你的代码中,你犯了两个错误:

  1. 您不使用.value来判断该字段是否已被选中。
  2. 处理程序应位于onchange元素的<select>处理程序中,而不是提交按钮的单击处理程序。

答案 1 :(得分:0)

使用jQuery在select的change事件上附加一个函数

jQuery('select').change(function(){
    valid = true;
    jQuery('select').each(function(){
        if (jQuery(this).val() == ''){
            valid = false;
            return false;
        }
    });

    if (valid == true){
        jQuery('#submit').removeAttr('disabled');
    } else {
        jQuery('#submit').attr('disabled','disabled');
    }    
});