只有在填写完所有字段后才启用提交按钮 [英] Enable submit button only when all fields are filled

问题描述

在我的表单中，我只想在选择所有字段（和单选按钮列表）时启用表单。

到目前为止，当 title 时，我已成功提交按钮 code>字段的内容为：



  onkeyup =if（this.textLength！= 0）{subnewtopic.disabled = false} else {subnewtopic.disabled = true}
  

我的目标是只启用一次提交按钮一切已被填写。我如何做到这一点？

以下是我的完整代码，其中包含有效的 jsfiddle ：

 < form action =method =postid =subnewtopicform/> 
 
标题：
  
< br /> 
 
说明：
< textarea name =description>< / textarea> 
 
< br /> 
类别：
< ul class =list：category categorychecklist form-no-clearid =categorychecklist> 
 
< li id =category-19>< label class =selectit>< input type =radioid =in-category-19name =类别值=19>动画< /标签>< /锂> 
 
< li id =category-20>< label class =selectit>< input type =radioid =in-category-20name =类别值=20>动画及LT; /标签>< /锂> 
 
< / ul> 
 
< input type =submitvalue =Submit Topicclass =button-primaryname =subnewtopicid =subnewtopicdisabled =disabled/> 
 
< / form> 
  

解决方案

这是您的一把小提琴。 http://jsfiddle.net/soyn0xag/6/
$ b $（$（$））$（$（$））$（$） .val（）！=&& $（textarea）.val（）！=&& $（input [name ='category']）。is（：checked ）== true）{
$（input [type ='submit']）。removeAttr（disabled）;
} else {
$（input [type ='提交']）。attr（disabled，disabled）;
}
}）; （$（））.val（）！=（）函数（）{

$（input [name ='category']）。 && $（textarea）.val（）！=&& $（input [name ='category']）。is（：checked）== true）{
$（input [type ='submit']）。removeAttr（disabled）;
} else {
$（input [type ='submit']）。attr（ 禁用，禁用）;
}
}）;


In my form, I want to enable form only when all fields (and radio button list) has been selected.

So far, I have successfully made the submit button enable when the title field has content with:

onkeyup="if(this.textLength != 0) {subnewtopic.disabled = false} else {subnewtopic.disabled = true}"

My aim is to enable submit button only once everything has been filled. How do I do this?

Here is my full code with working jsfiddle:

            <form action="" method="post" id="subnewtopicform" />

                Title:
                <input type="text" name="title" onkeyup="if(this.textLength != 0) {subnewtopic.disabled = false} else {subnewtopic.disabled = true}">

<br/>

                Description:
                <textarea name="description"></textarea> 

<br/>
                Category:
<ul class="list:category categorychecklist form-no-clear" id="categorychecklist">

<li id="category-19"><label class="selectit"><input type="radio" id="in-category-19" name="category" value="19"> Animation</label></li>

<li id="category-20"><label class="selectit"><input type="radio" id="in-category-20" name="category" value="20"> Anime</label></li>

    </ul>

                <input type="submit" value="Submit Topic" class="button-primary" name="subnewtopic" id="subnewtopic" disabled="disabled" /> 

            </form>

解决方案

Here is a fiddle for you. http://jsfiddle.net/soyn0xag/6/

$("input[type='text'], textarea").on("keyup", function(){
    if($(this).val() != "" && $("textarea").val() != "" && $("input[name='category']").is(":checked") == true){
        $("input[type='submit']").removeAttr("disabled");
    } else {
        $("input[type='submit']").attr("disabled", "disabled");
    }
});

$("input[name='category']").on("change", function(){
    if($(this).val() != "" && $("textarea").val() != "" && $("input[name='category']").is(":checked") == true){
        $("input[type='submit']").removeAttr("disabled");
    } else {
        $("input[type='submit']").attr("disabled", "disabled");
    }
});

这篇关于只有在填写完所有字段后才启用提交按钮的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！