使用laravel在选项卡中显示验证错误


Display validation error in tabs using laravel

在我的视图中,我有3个选项卡,其中显示不同类型的数据。在我的第三个标签,我张贴了一些数据,我使用laravel验证。我的问题是验证错误显示在我的第一个选项卡。我该怎么做才能在第三页显示错误呢?

我的控制器

$validator = Validator::make($request->all(), Rules::Event($request));
        if ($validator->fails()) {
           return back()->withErrors($validator)->withInput();
        }

视图页面

<ul class="nav nav-tabs">
          <li class="active"><a data-toggle="tab" href="#home">Upcoming Events</a></li>
          <li><a data-toggle="tab" href="#menu1">Popular Events</a></li>
          <li ><a data-toggle="tab" href="#menu2">Post an Event and sell ticket</a></li>
        </ul>
<div class="tab-content">
 <div id="home" class="tab-pane fade in active">
................
</div>
 <div id="menu1" class="tab-pane fade">
..............
</div>
 <div id="menu2" class="tab-pane fade">
<div class="event_tab_holder"> 

                @if (count($errors) > 0)
                    <div class="col-lg-12">
                        <div class="alert alert-danger">
                            <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
                            <h5><strong>{{ t('Oops ! An error has occurred. Please correct the red fields in the form') }}</strong></h5>
                            <ul class="list list-check">
                                @foreach ($errors->all() as $error)
                                    <li>{{ $error }}</li>
                                @endforeach
                            </ul>
                        </div>
                    </div>
                @endif
          </div>
    </div>
</div>

如何实现?请帮帮我,等待回复......

你可以试试这个:

add error class to li

<li class='error'>{{ $error }}</li>

然后使用下面的脚本:

   if ($(".tab-content").find('.error').text()) {
    $.each($(".tab-content").find('.error'), function (index, value) {
        if ($(this).text()) {
            $(".tab-content").children('.tab-pane').removeClass('active');
            $(this).closest('.tab-pane').addClass('active');
            $(".nav-tabs").children('li').removeClass('active');
            var id = $(this).closest('.tab-pane').attr('id');
            $.each($(".nav-tabs").children('li'), function (i, a) {
                if (('#' + id) == $(this).children('a').attr('href'))
                    $(this).addClass('active');
            });
            return false;
        }
    });
}