Php 将Laravel请求错误拆分为多个部分

Php 将Laravel请求错误拆分为多个部分,php,laravel,laravel-5,laravel-request,Php,Laravel,Laravel 5,Laravel Request,我希望能够将我的laravel错误消息分为多个部分 假设我有一个保险单页面,有3个部分 驾驶员详细信息 车辆详细信息 政策详情 我用的是一个像这样的laravel请求 'driver_name' => 'required', 'address_line_1' => 'required', 'address_line_2' => 'required', 'address_line_3' => 'required', 'postcode' => 'required',

我希望能够将我的laravel错误消息分为多个部分

假设我有一个保险单页面,有3个部分

驾驶员详细信息

车辆详细信息

政策详情

我用的是一个像这样的laravel请求

'driver_name' => 'required',
'address_line_1' => 'required',
'address_line_2' => 'required',
'address_line_3' => 'required',
'postcode' => 'required',
我希望在使用这样的输入请求进行验证时能够标记某些输入错误,以便在每个部分的顶部显示错误消息,而不是显示包含所有错误的巨大错误块

在请求中,我将如何使用一个节标记(如

“驱动程序名称”=>“必需”|部分:驱动程序详细信息”

把错误分开


如果无法标记laravel错误消息,那么实现这一点的最佳做法是什么?

您可以为每个验证规则获得$errors 所以,如果你有下一条规则:

'driver\u name'=>'required',

您只需在刀片服务器的driver_name字段顶部输出错误

@if ($errors->has('driver_name'))
    <div class="error">{{ $errors->first('driver_name') }}</div>
@endif
<input type="text" name="driver_name">
@if($errors->has('driver\u name'))
{{$errors->first('driver_name')}
@恩迪夫

您可以参考文档

您可以获得每个验证规则的$errors 所以,如果你有下一条规则:

'driver\u name'=>'required',

您只需在刀片服务器的driver_name字段顶部输出错误

@if ($errors->has('driver_name'))
    <div class="error">{{ $errors->first('driver_name') }}</div>
@endif
<input type="text" name="driver_name">
@if($errors->has('driver\u name'))
{{$errors->first('driver_name')}
@恩迪夫

您可以参考文档

您可以使用Vue.js和axios来验证和显示错误。在控制器中有一个名为/validate data的路由来验证数据

app.js文件:

       import Vue           from 'vue'
        window.Vue = require('vue');
        window.axios = require('axios');

        window.axios.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';

        let token = document.head.querySelector('meta[name="csrf-token"]');

        if (token) {
            window.axios.defaults.headers.common['X-CSRF-TOKEN'] = token.content;
        } else {
            console.error('CSRF token not found: https://laravel.com/docs/csrf#csrf-x-csrf-token');
        }

             class Errors {
                constructor() {
                    this.errors = {};
                }

                get(field) {
                    if (this.errors[field]) {

                        return this.errors[field][0];
                    }
                }

                record(errors) {
                    this.errors = errors;
                }

                clear(field) {
                    delete this.errors[field];
                }

                has(field) {
                    return this.errors.hasOwnProperty(field);
                }

                any() {
                    return Object.keys(this.errors).length > 0;
                }
            }

            new Vue({
             el: '#app',

                data:{
               errors: new Errors(),
              model: {
    driver_name: '',
    address_line1: '',
    address_line2: ''
    },
            },

        methods: {
          onComplete: function(){
              axios.post('/validate-data', this.$data.model)
                  // .then(this.onSuccess)
                  .catch(error => this.errors.record(error.response.data.errors));
           },
}
        });
使用控制器中的方法创建名为/验证数据的路由,执行标准验证

$this->validate(request(), [
'driver_name' => 'required',
'address_line_1' => 'required',
'address_line_2' => 'required',
'address_line_3' => 'required',
'postcode' => 'required'
]
然后使用与vue.js数据模型字段相对应的v-model在视图文件中创建输入。在其下方,添加一个带有错误类(例如,基本红色错误样式)的范围,该范围仅在错误存在时显示。例如:

<input type="text" name="driver_name" v-model="model.driver_name" class="input">
<span class="error-text" v-if="errors.has('driver_name')" v-text="errors.get('driver_name')"></span>

不要忘记在视图文件的页脚中包含app.js文件。请记住包含标记,并运行npm run watch编译vue代码。这将允许您验证其输入字段下的所有错误


忘记添加,请使用一个具有@onclick=“onComplete”的Button来运行验证方法。

您可以使用Vue.js和axios来验证和显示错误。在控制器中有一个名为/validate data的路由来验证数据

app.js文件:

       import Vue           from 'vue'
        window.Vue = require('vue');
        window.axios = require('axios');

        window.axios.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';

        let token = document.head.querySelector('meta[name="csrf-token"]');

        if (token) {
            window.axios.defaults.headers.common['X-CSRF-TOKEN'] = token.content;
        } else {
            console.error('CSRF token not found: https://laravel.com/docs/csrf#csrf-x-csrf-token');
        }

             class Errors {
                constructor() {
                    this.errors = {};
                }

                get(field) {
                    if (this.errors[field]) {

                        return this.errors[field][0];
                    }
                }

                record(errors) {
                    this.errors = errors;
                }

                clear(field) {
                    delete this.errors[field];
                }

                has(field) {
                    return this.errors.hasOwnProperty(field);
                }

                any() {
                    return Object.keys(this.errors).length > 0;
                }
            }

            new Vue({
             el: '#app',

                data:{
               errors: new Errors(),
              model: {
    driver_name: '',
    address_line1: '',
    address_line2: ''
    },
            },

        methods: {
          onComplete: function(){
              axios.post('/validate-data', this.$data.model)
                  // .then(this.onSuccess)
                  .catch(error => this.errors.record(error.response.data.errors));
           },
}
        });
使用控制器中的方法创建名为/验证数据的路由,执行标准验证

$this->validate(request(), [
'driver_name' => 'required',
'address_line_1' => 'required',
'address_line_2' => 'required',
'address_line_3' => 'required',
'postcode' => 'required'
]
然后使用与vue.js数据模型字段相对应的v-model在视图文件中创建输入。在其下方,添加一个带有错误类(例如,基本红色错误样式)的范围,该范围仅在错误存在时显示。例如:

<input type="text" name="driver_name" v-model="model.driver_name" class="input">
<span class="error-text" v-if="errors.has('driver_name')" v-text="errors.get('driver_name')"></span>

不要忘记在视图文件的页脚中包含app.js文件。请记住包含标记,并运行npm run watch编译vue代码。这将允许您验证其输入字段下的所有错误


忘记添加了,有一个buttton,它有@onclick=“onComplete”来运行validate方法。

我猜,为每个部分编写一些自定义的验证器函数。然后找出一种方法,找出一个请求属于哪个部分,并将该请求传递给正确的验证器函数。验证与演示不同,因此您可能需要编写代码,手动将错误放入输入的“bucket”组中,即
。为每个部分编写一些自定义验证器函数,我想是吧。然后找出一种方法,找出请求属于哪个部分,并将请求传递给正确的验证器函数。验证与演示不同,因此您可能需要编写代码,手动将错误放入输入的“bucket”组中,即
。感谢您的建议,但是我不想列出每一个错误并检查它的集合,我希望能够运行一段代码并找出错误的位置。我不确定这是否可行。至少我没有遇到这样的事情谢谢你的建议,但我不会列出每个错误并检查其设置,我希望能够运行一段代码并找出错误的位置。我不确定这是否可行。至少我没有遇到过这样的事情,我会调查的!谢谢太棒了,我会调查的!谢谢