Automatically refresh my wfs layer in Leaflet when adding data in Postgis

421 views
Skip to first unread message

jerome.h...@geoqriosity.com

unread,
Jun 14, 2016, 8:48:27 AM6/14/16
to Leaflet

I’ve built a web-sig based on postgis, geoserver and leaflet. My polylines, …, are stored in Postgis and I call them through Geoserver in Leaflet as wfs layers like :

var defaultParameters = {
    service : 'WFS',
    version : '1.0.0',
    request : 'GetFeature',
    typeName : 'database:table’,
    outputFormat : 'text/javascript',
    format_options : 'callback:callEP', 
    srsName : 'EPSG:4326',
    };

var parameters = L.Util.extend(defaultParameters);

var ajaxEP = $.ajax({
    url : owsrootUrlAssainissement + L.Util.getParamString(parameters),
    dataType : 'jsonp',
    jsonpCallback: 'callEP',
    success : function (layerEP) {
        EP = L.geoJson(layerEP, { 
            style: function (feature) {
                return {
                    color: "lime",
                    fillColor: 'lime',
                    opacity: 1,
                    weight: 3,
                };
            },
     });
   }
});

I’m also using leaflet draw to draw new polylines and I send them into Postgis using ajax and php :

map.on('draw:created', function (e) { 
        layerEP = e.layer;
        var coordinatesEP = layerEP.getLatLngs(); 
        var sql_coordinatesEP =[]; 
        for (var i in coordinatesEP){
                sql_coordinatesEP.push(coordinatesEP[i].lng+" "+coordinatesEP[i].lat);
            }

        dialog_create_EP.dialog("open");

        $("#formulaire").submit(function(){
                $('#coordsCreateEP').val(sql_coordinatesEP); 
                $('#longueurCreateEP').val(longueurEP);

                                    var formData = {
                                      'type' : $('select[name=type]').val(),
                                      'diametre' : $('select[name=diametre]').val(),
                                      'coordsCreateEP' : $('#coordsCreateEP').val(),
                                    };
                                    $.ajax({
                                      url:'create_EP.php',
                                      type: 'POST',
                                      data: formData,
                                      success : function(data, response) {
                                        dialog_create_EP.dialog("close");
                                    }
                               });
                         });
    });
});

php :

$type = $_POST['type'];
$diametre = $_POST['diametre'];
$coordsCreateEP = $_POST['coordsCreateEP'];

try
{
   $bdd = new PDO("pgsql:host=$host;dbname=$database",$user,$pass);
   $bdd->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);

$req = $bdd->prepare('INSERT INTO database.table(type,diametre,coords) VALUES(?,?,?)');


$req->execute(array($type,$diametre,$coordsCreateEP));

   }
catch(Exception $e)
{
    echo "Connection a la BDD impossible : ", $e->getMessage();
 die();
}

Everything works fine, and when I’m sending new polylines via ajax, my page is reloaded and my new polylines appears when I’m adding their layer.


Ok, now, What I would like to do would be to not refresh all my page when sending new polylines but just the layer with the new polylines. 

So is there a way to refresh a leaflet layer automatically when adding data into Postgis without reloading all my page ?


PS : I've posted my question on gis.stackexchange.com, here http://gis.stackexchange.com/questions/197708/automatically-refresh-my-wfs-layer-in-leaflet-when-adding-data-in-postgis/197755#197755


Reply all
Reply to author
Forward
0 new messages