如何在 Laravel 形式的循环中验证至少一个复选框被选中?
How to validate at least one checkbox is checked in a loop in Laravel form?
我的应用程序中有一组复选框。我想要做的是验证是否至少选中了一个并启用提交按钮。基本上是前端验证。根据当前代码,用户必须 select 所有复选框。我知道这应该是一个小问题,但由于我是 Laravel 框架的新手,所以我有点难以理解。请有人在这里帮助我。
@foreach ($roles as $role)
<li>
{{ Form::checkbox('roles[]', $role->id, null, ['class="role-li"', 'required']) }}
{{ Form::label($role->name, ucfirst($role->name)) }}
</li>
@endforeach
<form id="testform" action="/comment" method="post" class="m-0 mt-4">
@for($i=0;$i<5;$i++)
<input type="checkbox" name="vehicle1" value="Bike" class="role-li role{{$i}}" onclick='checktest()'> I have a bike<br>
@endfor
</form>
<script>
var minimumonechecked;
var noofboxes = $('.role-li').length;
function checktest(xyz) {
minimumonechecked = false;
for(i=0;i<noofboxes;i++){
if ($('.role' + i).is(':checked')) {
minimumonechecked = true;
}
}
console.log(minimumonechecked)
};
</script>
这段代码对我有用:)
试试这个
var checkboxes = $(".check-cls"),
submitButt = $(".submit-btn");
checkboxes.click(function() {
submitButt.attr("disabled", !checkboxes.is(":checked"));
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<h1>Button should be enabled if at least one checkbox is checked</h1>
<form>
<div>
<input type="checkbox" name="roles[]" id="role-1" class="check-cls"> <label for="role-1">Role 1</label>
</div>
<div>
<input type="checkbox" name="roles[]" id="role-2" class="check-cls"> <label for="role-2">Role 2</label>
</div>
<div>
<input type="checkbox" name="roles[]" id="role-3" class="check-cls"> <label for="role-3">Role 3</label>
</div>
<div>
<input type="checkbox" name="roles[]" id="role-4" class="check-cls"> <label for="role-4">Role 4</label>
</div>
<div>
<input type="checkbox" name="roles[]" id="role-5" class="check-cls"> <label for="role-5">Role 5</label>
</div>
<div>
<input type="submit" class="submit-btn" value="Submit" disabled>
</div>
</form>
我的应用程序中有一组复选框。我想要做的是验证是否至少选中了一个并启用提交按钮。基本上是前端验证。根据当前代码,用户必须 select 所有复选框。我知道这应该是一个小问题,但由于我是 Laravel 框架的新手,所以我有点难以理解。请有人在这里帮助我。
@foreach ($roles as $role)
<li>
{{ Form::checkbox('roles[]', $role->id, null, ['class="role-li"', 'required']) }}
{{ Form::label($role->name, ucfirst($role->name)) }}
</li>
@endforeach
<form id="testform" action="/comment" method="post" class="m-0 mt-4">
@for($i=0;$i<5;$i++)
<input type="checkbox" name="vehicle1" value="Bike" class="role-li role{{$i}}" onclick='checktest()'> I have a bike<br>
@endfor
</form>
<script>
var minimumonechecked;
var noofboxes = $('.role-li').length;
function checktest(xyz) {
minimumonechecked = false;
for(i=0;i<noofboxes;i++){
if ($('.role' + i).is(':checked')) {
minimumonechecked = true;
}
}
console.log(minimumonechecked)
};
</script>
这段代码对我有用:)
试试这个
var checkboxes = $(".check-cls"),
submitButt = $(".submit-btn");
checkboxes.click(function() {
submitButt.attr("disabled", !checkboxes.is(":checked"));
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<h1>Button should be enabled if at least one checkbox is checked</h1>
<form>
<div>
<input type="checkbox" name="roles[]" id="role-1" class="check-cls"> <label for="role-1">Role 1</label>
</div>
<div>
<input type="checkbox" name="roles[]" id="role-2" class="check-cls"> <label for="role-2">Role 2</label>
</div>
<div>
<input type="checkbox" name="roles[]" id="role-3" class="check-cls"> <label for="role-3">Role 3</label>
</div>
<div>
<input type="checkbox" name="roles[]" id="role-4" class="check-cls"> <label for="role-4">Role 4</label>
</div>
<div>
<input type="checkbox" name="roles[]" id="role-5" class="check-cls"> <label for="role-5">Role 5</label>
</div>
<div>
<input type="submit" class="submit-btn" value="Submit" disabled>
</div>
</form>