Error: Request failed with status code 500 Laravel/Vue

Question

This is the full error message in the console :

POST http://127.0.0.1:8000/formSubmit 500 (Internal Server Error)
dispatchXhrRequest @ app.js:279
xhrAdapter @ app.js:118
dispatchRequest @ app.js:726
Promise.then (async)
request @ app.js:528
Axios.<computed> @ app.js:553
wrap @ app.js:1071
formSubmit @ app.js:1896
invokeWithErrorHandling @ app.js:25465
invoker @ app.js:25790
original._wrapper @ app.js:31143

I'm trying to get data from a VueJs form and insert them into a MySql database through a laravel controller

My VueJs submit method:

        methods: {
            formSubmit(e) {
                e.preventDefault();
                let currentObj = this;
                axios.post('/formSubmit', {
                    first: this.first,
                    last: this.last,
                    phone: this.phone,
                })
                .then(function (response) {
                    currentObj.output = response.data;
                })
                .catch(function (error) {
                    currentObj.output = error;
                });
            }

My controller:

class StudentsController extends Controller
{
    public function formSubmit(Request $request)
    {
        $validatedData = $request->validate([
            'first' => 'required|string',
            'last' => 'required|string',
            'phone' => 'required',
        ]);

        $s = new Student();
        $s->first = $validatedData->first;
        $s->last = $validatedData->last;
        $s->phone = $validatedData->phone;
        $s->save();

        return response()->json($validatedData);
    }
}

It's just a demo project so if there's other ways to submit without getting this error that'll work too.

Thanks

Open your browser dev tools and find the error in the network tab preview — Salim Djerbouh
– Salim Djerbouh, Commented Sep 30, 2019 at 9:37
Looks like my database 'first' field was actually named 'first_name' so i was trying to assign $validatedData->first; to something that doesnt exist. Big thank you Caddy DZ that actually helped — moepart
– moepart, Commented Sep 30, 2019 at 10:13

Gias · Accepted Answer · 2019-09-30 10:23:50Z

2

500 server error means the problem lies in your laravel controller. So check every field name of the table. check if there any column name first in your table. if it exists check what are you getting from your front-end? check are you getting valid data so at the beginning of the controller check by it.

return $request->first

if it's also right then try saving data directly from the request

$this->validate($request,[
            'first' => 'required|string',
            'last' => 'required|string',
            'phone' => 'required',
        ]);

        $s = new Student();
        $s->first = $request->first;
        $s->last = $request->last;
        $s->phone = $request->phone;
        $s->save();

        return response()->json(['result'=>$s]);

answered Sep 30, 2019 at 10:23

Gias

761 silver badge9 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Error: Request failed with status code 500 Laravel/Vue

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related