CODEWITHSUNDEEP
ajaxlaravellaravel-5
Przemek Wojtas
Przemek Wojtas

Reputation: 1371

Laravel sending form via ajax, and validate using request?

I am doing ajax which looks like this:

Ajax:

$('form').submit(function(e) {
    e.preventDefault();
    var myform = document.getElementById('#createEntity');
    var fd = new FormData(myform);
    console.log($(this).serialize());
    $.ajax({
        url: "create/add",
        type: 'post',
        dataType: 'JSON',
        success: function(data) {
            $('#submit_div').html('<button type="button" class="btn.btn-success"><a href="/profile/entity/edit/'+ data.results +'">Edit</a></button');
        },
        error: function(data) {
            alert("Oh no!");
        },
        headers: {
        'X-CSRF-Token': $('meta[name="csrf-token"]').attr('content')
        }
    });
}

Controller:

public function storeEntity(EntityRequestCreate $request)
    {
        $geoloc = new Geoloc;
        $geoloc->lat = $request->input('lat');
        $geoloc->lng = $request->input('lng');
        $geoloc->slug = $request->input('name');
        $geoloc->save();

        $user_id = Auth::id();
        $entity = new Entity;
        $entity->name = $request->input('name');
        $entity->type = $request->input('type');
        $entity->email = $request->input('email');
        $entity->tags = $request->input('tags');
        $entity->_geoloc()->associate($geoloc);
        $entity->save();

        $entity_id = $entity->id;

        $address = new Address;
        $address->building_name = $request->input('building_name');
        $address->address = $request->input('address');
        $address->town = $request->input('town');
        $address->postcode = $request->input('postcode');
        $address->telephone = $request->input('telephone');
        $address->entity_id = $entity_id;
        $address->save();

        $role = User::find($user_id);
        $role->role = "2";
        $role->save();

        DB::table('entity_user')->insert(array('entity_id' =>  $entity_id, 'user_id' => $user_id));

        $result = $geoloc->save();
        $result2 = $entity->save();
        $result3 = $address->save();
        $result4 = $role->save();

        if($result && $result2 && $result3 && $result4) {
            $data = $entity_id;
        }else{
            $data = 'error';
        }
        return redirect('profile/entity');
    }

Now the problem is, that I cannot get the data from the form, it is always empty. What is the proper way of sending form throught ajax and dealing with it in controller? I have tried various method like this one above, onclick event on button and nothing seems to work, above code submits and refreshes the page for some reason and it's never successful

Upvotes: 1

Views: 1049

Answers (2)

Jerodev
Jerodev

Reputation: 33186

You didn't add any data to your ajax request. Add the data property to your request object.

$.ajax({
    url: "create/add",
    type: 'POST',
    dataType: 'JSON',
    data: $(this).serialize(),    // <-- Added data property
    success: function(data) {
        $('#submit_div').html('<button type="button" class="btn.btn-success"><a href="/profile/entity/edit/'+ data.results +'">Edit</a></button');
    },
    error: function(data) {
        alert("Oh no!");
    },
    headers: {
        'X-CSRF-Token': $('meta[name="csrf-token"]').attr('content')
    }
});

Upvotes: 4

AddWeb Solution Pvt Ltd
AddWeb Solution Pvt Ltd

Reputation: 21681

As per jQuery.ajax function's documentation, Correct syntax to send the AJAX datax is:

$.ajax({
  method: "POST",
  url: "some.php",
  data: { name: "John", location: "Boston" }
})

So use data: $(this).serialize(), along with code to post data.

Upvotes: 1

Related Questions