jquery .ajax function not working properly with Laravel-4

Question

what I am trying to do is to pass a variable from my view to a controller function..The problem is that I am never routed to my controller's function store.So I cant check if I get the variable as well. The ajax function seems to work(the alert is displayed) but I never get the message success from my controller..

So far my route file is :

Route::get('pois', array(
    'uses' => 'MapController@create',
    'as' => 'pois.create'
    ));

Route::post('pois', array(
    'uses' => 'MapController@store',
    'as' => 'pois.get'
    ));

My MapController is:

public function create()
{

    $bar=new Map;
    $rest=new Map;
    $mag=new Map;

    $bar = Map::where('type', '=', 'bar')->take(10)->get();
    $rest = Map::where('type', '=', 'restaurant')->take(10)->get();
    $mag = Map::where('type', '=', 'magazine')->take(10)->get();

    return View::make('pois.markers')->with('bar',$bar)->with('rest',$rest)->with('mag',$mag);

}

/**
 * Store a newly created resource in storage.
 *
 * @return Response
 */
public function store()
{
    dd('suceess');

}

And my javascript-jquery script is bellow:

function ajaxCall(id) {



       $.ajax
        ({
                type: "POST",
                url: "pois",
                data: {"id" : id}, 
                success: function(response)
                  { 
                    alert('ok');
                  }
        });
}



function checkBoxes(elem){

if(document.getElementById(elem).checked==true){

  ajaxCall(elem); 

}
else{

clearMarkers(elem);

}

}

Bellow is my HTML as well :

@section('main_contents')

    <br/>

    <div class="text-center">





<label class="checkbox-inline">
  <input type="checkbox" id="bar" name="group" value="option1" onClick="checkBoxes(this.id)"> Καφετέριες
</label>
<label class="checkbox-inline">
  <input type="checkbox" id="restaurant" name="group"  value="option2" onClick="checkBoxes(this.id)"> Εστιατόρια
</label>
<label class="checkbox-inline">
  <input type="checkbox" id="magazine" name="group"  value="option3" onClick="checkBoxes(this.id)"> Μαγαζιά
</label>



<br/>

</div>

     <div id="map" style="height:500px;"></div>

     @stop

Anam · Accepted Answer · 2013-12-27 01:24:39Z

1

You are not receiving success message because you are not returning any message from your controller.

change dd('success'); to return 'success';

public function store()
{
    return 'success';

}

Your Ajax code:

$.ajax
        ({
                type: "POST",
                url: "pois",
                data: {"id" : id}, 
                success: function(response)
                  { 
                    alert(response);
                  }
        });

Edit:

Change URL url: "pois", to url: "/pois",

Jquery code:

$( document ).ready(function() {

    $(".checkbox").change(function() {
        if(this.checked) {

            var id = $('.checkbox').val();

            var request = $.ajax({
              url: '/pois',
              type: "POST",
              data: { id : id },
              dataType: "html"
            });

            request.done(function(result) {
                if(result == 'success') {
                    alert("Success");
                } else {
                    alert ("Sorry! unable to add the data");
                }
            });

            request.fail(function(jqXHR, textStatus) {
              console.log( "Request failed: " + textStatus );
            });
        }
    });
});

HTML code:

@section('main_contents')
    <br/>
    <div class="text-center">

        <label class="checkbox-inline">
            <input type="checkbox" id="bar" class="checkbox" name="group" value="1"> Καφετέριες
        </label>
        <label class="checkbox-inline">
            <input type="checkbox" id="restaurant" class="checkbox" name="group"  value="2"> Εστιατόρια
        </label>
        <label class="checkbox-inline">
            <input type="checkbox" id="magazine" class="checkbox" name="group"  value="3"> Μαγαζιά
        </label>

        <br/>

    </div>

     <div id="map" style="height:500px;"></div>

@stop

I haven't tested the code but should work.

edited Dec 27, 2013 at 1:24

answered Dec 27, 2013 at 0:20

Anam

12.2k9 gold badges51 silver badges64 bronze badges

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

5 Comments

John Over a year ago

No its still not working...The dd function should work...it s shortcut for var_dump and die...the problem is i never reach my store function..

Anam Over a year ago

I think, your Ajax URL has problem. try to change the URL to /pois

John Over a year ago

I have tried that also...No luck though..Does it mind that my script has some javascript and some other jquery functions..?

Anam Over a year ago

Which browser are you using? if you using Chrome, check the network section from developer tool. you will see the error.

Anam Over a year ago

Would you mind if i change your javascript and HTML. I will use pure JQuery and html5

Vipul Walia · Accepted Answer · 2018-09-18 10:00:22Z

0

While making ajax call to controller... you can check like this

$jsonResponse = [
                 'imageReceived' =>  $r->hasFile('profilePicture')
                ];
return $jsonResponse;

This will return response to console with true or false like this

{"imageReceived":false}

edited Sep 18, 2018 at 10:00

answered Sep 18, 2018 at 9:38

Vipul Walia

115 bronze badges

Collectives™ on Stack Overflow

jquery .ajax function not working properly with Laravel-4

2 Answers 2

5 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

5 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related