vue.js - Laravel Validation with vue js -
i want post ajax request using vue-resource this.$http.post
request. worked fine if passed validation rules want validations if fails. far keep getting 500 error if don't fill out input fields. it's hard me debug error because didn't appeared on network tab.
here's i've done far
//my modal component <script> export default { props: ['show'], data() { return { input: { id: '', name: '', address: '', email: '' }, errorinputs: {} } }, methods: { createstudent() { this.$http.post('/students', this.$data.input) .then((response) => { alert('added new row!) }, (response) => { console.log(response.data); }); } } } </script> // controller public function store(request $request) { $validator = $this->validate($request,[ 'id' => 'required', 'name' => 'required|unique:students', 'email' => 'required|unique:students|email', 'address' => 'required', ]); if($validator->passes()){ student::create($request->all()); return response()->json([], 201); } $errors = json_decode($validator->errors()); return response()->json([ 'success' => false, 'message' => $errors ],422); }
any helps , references appreciated. using laravel 5.3 , vue js 2
$this->validate()
returns 422
error response alongside validation errors, should errors in then()
second callback (like now). vue component body should this:
{ data() { // ... }, createstudent() { this.$http .post('/students', this.input) .then(this.handlesuccess, this.handleerror) }, handlesuccess(res) { alert('student created') }, handleerror(res) { if (res.status === 422) { this.errorinputs = res.body } else { alert('unkown error!') } } }
remember add v-model="input.fieldname"
properties inputs.
Comments
Post a Comment