How to pass leaflet current coordinate to a Laravel controller for use as a variable-CodePudding

I am currently stuck for days trying to make this work. I found a plugin for Leaflet that can filter data based on radius from coordinate (Leaflet-Coordinate). I tried hardcoding the coordinate into the controller, and it worked perfectly.

My question is how do I take the current coordinates from my Leaflet map and use it as the variable for the controller function?

Here is my main map js code:

  var map = L.map('map', 15);
        L.tileLayer('https://api.mapbox.com/styles/v1/{id}/tiles/{z}/{x}/{y}?access_token={accessToken}', {
            attribution: 'Map data &copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors, Imagery © <a href="https://www.mapbox.com/">Mapbox</a>',
            maxZoom: 17,
            id: 'mapbox/streets-v11',
            tileSize: 512,
            zoomOffset: -1,
            accessToken: 'pk.eyJ1IjoiZGFuaWVscmFjaGV2YXNraSIsImEiOiJjbDFlZzBpN2wwcjE1M2ZuNHF3NXRvbGh5In0.U44yx8ueWFpYviMcI1U1Sw'
        }).addTo(map);

        map.locate({setView: true});

        map.on('locationfound', function(e) {
            console.log(e.latlng.lat, e.latlng.lng);
            var lat = e.latlng.lat;
            var lng = e.latlng.lng;
            //I want to take this coordinate to controller
        })

And here is the controller code:

 public function mainpagebenef(){
        //$lat = $request->get('lat');
        //$lng = $request->get('lng');
        $beneficiary = beneficiary::nearby([
            1.4701624933456898, //latitude, this is supposed to be coords for current location in leaflet
            110.42952010069433 //longitude, this is supposed to be coords for current location in leaflet
            ],0.5)->closest()
            ->where('status', '=', 'Mahu Bantuan')->get();
        $donor = DB::table('donor')->get();
        return view('mainpagebenef', ['beneficiary' => $beneficiary], ['donor' => $donor]);
    }

Here is the route:

 Route::get('/mainpagebenef', 'mainpagecontroller@mainpagebenef')->name('mainpagebenef');

I tried for days on end and searched countless tutorials, but to no avail. I'm quite new to laravel and leaflet as a whole, so any help is really appreciated!

CodePudding user response：

It seems that you are locating users or something through a js library. That code run on client side , but you need client side data in the server side. One possible solution is to use Axios and send a request to your server with those data you are requiring.

Here you are an example on how to do it, easily. First you will have to install Axios in Laravel, which is really simple.

CodePudding user response：

Your js Code should look like

map.on('locationfound', function(e) {
    console.log(e.latlng.lat, e.latlng.lng);
    
    var lat = e.latlng.lat;
    var lng = e.latlng.lng;
    
    axios.post('/myControllerPostMethod', {
       
        latitude: lat,
        longitude: lng
    })
        .then(function (response) {
            console.log(response);
        })
        .catch(function (error) {
            console.log(error);
        });
   
})

And in your controller should be a method accepting post request

public function myControllerPostMethod(){
   
   //$input = $request->all();

   $lat = $request->input('latitude');
   $lng = $request->input('longitud');

    
}