必填字段变为红色

Question

帮助我在必填字段上假设在空时会改变颜色，如下所示：当提交表单后出现必填字段时， course_id 和grade_id 的下拉菜单应变为红色。这是我用来创建过去教育表格的表格。form_modal.blade.php：    <div class="form-group required">        <label class="col-lg-2 control-label">{{ msg('lbl_institute') }}</label>        <div class="col-lg-4">            {!! Form::dropdown('institution_id', $institution, @$pasteducationinfo['institution_id'],'class="select2-form institution_id"') !!}        </div>    </div>    <div id="institution" class="form-group hide">        <label class="col-lg-2 control-label">{{ msg('lbl_institute') }}</label>        <div class="col-lg-4">            <input type="text" name="institution_name" class="form-control" value="{{ @$pasteducationinfo['institution_name'] }}" placeholder="SMK Cyberjaya">        </div>    </div>    @if(!empty($edulevelinfo['is_course_able']))    <div class="table-responsive repeater">        <table id="courseassessmentnew-table" class="table table-striped b-t b-b" data-repeater-list="pasteducation">            <thead>                <th>{!! msg('lbl_course') !!}</th>                <th>{!! msg('lbl_grade') !!}</th>                <th></th>            </thead>            <tbody>            @if(!empty($pasteducationdetailinfo))                @foreach($pasteducationdetailinfo as $detailinfo)                    @if (!empty($detailinfo->educationCourse->is_mandatory))                        <tr>                            <td>                                {!! $educourseselection[$detailinfo['course_id']] !!}                                <input type="hidden" name="course_id[]" value="{{ @$detailinfo['course_id'] }}">                            </td>                            <td>                                {!! Form::dropdown('grade_id[]', $gradeselection, $detailinfo['grade_id'],'class="select2-form"') !!}                            </td>                            <td></td>                        </tr>                    @else      

Answer 1

如果您使用 Laravel 验证，这将对您有所帮助。

添加@error("input-name") is-invalid @enderror您的输入类。

并显示错误消息：

@error('email')

    <span class="invalid-feedback" role="alert">

        <strong>{{ $message }}</strong>

    </span>

@enderror

如果有任何错误，它会显示为，

Answer 2

从 Bootstrap 4 => https://getbootstrap.com/docs/4.0/components/forms/?#validation

您需要is-valid在institution_id下拉列表中添加类