热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

如何使用复选框制作表单,请在选中该复选框时禁用其他输入,但启用随后的下一个输入de键入文本

我创建了一个表单,该表单有时会选择一个选项来完成答案

我创建了一个表单,该表单有时会选择一个选项来完成答案

如何使用复选框制作表单,请在选中该复选框时禁用其他输入,但启用随后的下一个输入de键入文本

当一个复选框被选中但我想禁用对应于

的输入文本时,我设法禁用了另一个选项


function enableDisableAll(e) {
var own = e;
var form = document.getElementById('myForm');
var elements = form.elements;
for (var i = 0 ; i if(own !== elements[i] ){
if(own.checked == true){
elements[i].disabled = true;
}else{
elements[i].disabled = false;
}
}
}
}

.form_control label{
font-weight: normal;
font-size: 9px;
text-align: left;
color: #2c2c2c;
}
.gestion_compte_consultant{
display: flex;
flex-direction: column;
align-content: center;
}
.title_form{
padding-bottom: 1.125rem;
margin-bottom: 1.125rem;
font-weight: bold;
font-size: 12px;
color: #1d5ba6;
text-align: center;
}
.form_control{
margin-bottom: 1.5rem;
}
.form_control label{
display: flex;
flex-wrap: nowrap;
align-items: center;
}
/* .form_control label span{
text-align: match-parent;
} */
.form_control span{
text-align: justify;
}
.form_control input[type=text]{
margin-left: auto;
width: 98.09px;
height: 18.5px;
border-radius: 8px;
background: transparent;
border: 1px solid #979797;
font-size: 9px;
text-align: left;
color: #2c2c2c;
}
/* .square{
display: none;
} */
.square + .LabelTransact:before{
display: inline-block;
padding-right: 1rem;
font-family: "FontAwesome";
font-size: 1rem;
font-weight: 400;
content: "\f058";
color: #C7C7CC;
clear: both;
}
.square:checked + .LabelTransact:before{
color: #007AFF;
}
.form-field input[type=submit]{
display: block;
margin-left: auto;
margin-right: auto;
padding: 8px;
border: none;
border-radius: 8px;
background: #A7B123;
color: #fff;
}

{!! Form::open(['route' => 'Usertransac','method' => 'POST','id' => 'myForm']) !!}

Option de salaire pour le mois d'août 2019



{{Form::checkbox('allSalary',true,(bool) 0,['class' => 'square','onclick' => 'enableDisableAll(this)' ])}}
{{Form::label('allSalary','Recevoir un salaire en utilisant tout mon solde',['class' => 'LabelTransact'])}}


{{Form::checkbox('salIfSolde','onclick' => 'enableDisableAll(this)' ])}}
{{Form::label('salIfSolde','Recevoir un salaire uniquement si mon solde atteint',['class' => 'LabelTransact'])}}
{{Form::text('salIfSolde','',['id' => 'montantSaluntil','onkeypress' => 'isInputNumber(event)','placeholder' => '(Min.420)'])}}


{{Form::checkbox('minSolde','onclick' => 'enableDisableAll(this)' ])}}
{{Form::label('minSolde','Recevoir un salaire uniquement si je peux conserver sur mon Espace adhérent la somme de',['class' => 'LabelTransact'])}}
{{Form::text('minSolde',['id' => 'montantSaluntil2','placeholder' => '(Min.1)'])}}


{{Form::checkbox('salIfSolde','Me verser une paie sans dépasser un salaire net (hors frais et hors PAS) de ','placeholder' => '(Min.220)'])}}


{{Form::checkbox('no_Salary','onclick' => 'enableDisableAll(this)' ])}}
{{Form::label('no_Salary','Ne pas recevoir de salaire ni de frais ce mois-ci',['class' => 'LabelTransact'])}}


{!! Form::submit('VALIDER') !!}

{!! Form::close() !!}


我找不到启用复选框处于选中状态的行并检索数据的方法
我想当我求和时,所有其他数据将被认为在我的数据库中为空


代替遍历所有表单元素,将要禁用/启用的表单元素的ID保留在不同的数组中,然后分别定位。


function enableDisableAll(e) {
var checkboxes = [
'allSalary','salIfSolde','minSolde','salIfSolde'
];
for (var i = 0; i var checkbox = = document.getElementById(checkboxes[i]);
if (e.checked) {
checkbox.disabled = true;
} else {
checkbox.disabled = false;
}
}
}


更新:将id添加到每个元素(包括没有id的元素),然后在此函数中将id添加到数组。例如:

{{Form::checkbox('salIfSolde',true,false,['id' => 'check-salIfSolde','class' => 'square','onclick' => 'enableDisableAll(this)' ])}}

推荐阅读
author-avatar
只做不说
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有