如何验证下拉列表中的“其他”选项？

Question

如何验证我在 Laravel 4.2 中的其他 输入字段，该字段在 下拉 列表中选择 Other 选项后出现？我的下拉列表中的值已经是必需的，现在我想在我的输入字段上应用相同的验证逻辑和错误，以便两者都是必需！通过满足下拉列表中的第一个验证规则，输入字段中的第二个验证规则会输出错误！解决这个问题的最简单方法是什么！

<div class="row">

                    <div class="col-lg-6 col-sm-6 col-md-6">



            <script type="text/javascript">
                function showfield(name){
                        if(name=='Other')document.getElementById('div1').innerHTML='<input class="custom-input" placeholder="Roles" style="margin-left: 32px;" name="roles" type="text" value/>';

                        else document.getElementById('div1').innerHTML='';
                    }
            </script>



                <select id="otherField" name="role" onchange="showfield(this.options[this.selectedIndex].value)">
                    <option value="" selected="selected">Select role</option>
                    <option value="UI/UX designers">UI/UX designers</option>
                    <option value="QA engineers">QA engineers</option>
                    <option value="Developer">Developer</option>
                    <option value="Scrum Master">Scrum Master</option>
                    <option value="CEO">CEO</option>
                    <option value="Director">Director</option>
                    <option value="Other">Other</option>
                </select>
                    <div id="div1" class="row">
                           <div class="col-lg-6 col-sm-6 col-md-6"></div>
                    </div>
                    <div class="col-md-6">
                                                        @if($errors->first('roles') )
                                                            <div class="fe-form-error">
                                                                <div class="icon"></div>
                                                                {{ $errors->first('roles') }}
                                                            </div>
                                                        @endif
                                                        </div>

                    </div>

                                                        <div class="col-md-6">
                                                        @if($errors->first('role') )
                                                            <div class="fe-form-error">
                                                                <div class="icon"></div>
                                                                {{ $errors->first('role') }}
                                                            </div>
                                                        @endif
                                                        </div>

            </div>

我的类有验证规则：

class OnEventRegistration extends AbstractValidator {

    protected $customRules = false;

    protected $rules = array(
        'email'             =>      'required|email|unique:users',
        'password'          =>      'required|min:8|confirmed',
        'first_name'        =>      'required',
        'last_name'         =>      'required',
        'role'              =>      'required',
        'roles'             =>      'required',

    );
}

Answer 1

您需要使用required_if。

protected $rules = array(
    'email'             =>      'required|email|unique:users',
    'password'          =>      'required|min:8|confirmed',
    'first_name'        =>      'required',
    'last_name'         =>      'required',
    'role'              =>      'required',
    // This says required only if role = 'Other'
    'roles'             =>      'required_if:role,Other',
);

您可能还需要另一种方法来有条件地显示您的 roles 输入，以便它实际上被识别为表单中 DOM 的一部分。

<script>
function showfield(el) {
if (el.value == 'Other') {
    document.getElementById('roles').style.display = 'block';
} else {
    document.getElementById('roles').style.display = 'none';
}
</script>

<select id="otherField" name="role" onchange="showfield(this)">
    <!-- options -->
</select>

<input id="roles" style="display: none; margin-left: 32px;" name="roles" type="text" placeholder="Roles" class="custom-input">