1

To begin I will explain the code, I have a checkbox generated after loading the web page by the next code

    var CPID = new L.GeoJSON(false,
{
          onEachFeature: function (feature, my_Layer) {
           var element = document.getElementById("DDL");
           //alert(feature.properties.id_cp)
           element.innerHTML += ' <br>&nbsp;&nbsp;&nbsp;&nbsp;<input type="checkbox" id="' + feature.properties.id_cp + '" value="' + feature.properties.id_cp + '" name="Circuit" onchange="CP(this.id)">';
           element.innerHTML += '<img style="width:30px;height:10px;" src="images/CP/' + feature.properties.id_cp + '.png" /><label>&nbsp;&nbsp;' + feature.properties.id_cp + '</label>';

}
});
var urlCPID = 'http://localhost:8080/geoserver/Gestion-proprete/ows?service=WFS&version=1.0.0&request=GetFeature&typeName=Gestion-proprete:CP_ID&maxFeatures=500&outputFormat=text/javascript&format_options=callback:getJsoncp&srsName=EPSG:4326'
$.ajax({
    jsonp: false,
    url: urlCPID,
    type: 'GET',
    dataType: 'jsonp',
    jsonpCallback: 'getJsoncp',
    success: function (data) {
        CPID.addData(data);
    }
});

This code will fill the list of the checkbox from layer wfs share in geoserver after this

when I checked one of this box he called this function

function CP(code) {
    var group = new L.featureGroup();
    var CPG = new L.GeoJSON();
    var CPG = new L.GeoJSON(false,
            {
                onEachFeature: function (feature, my_Layer) {
                    my_Layer.bindPopup("ID: " + feature.properties.id_cp + "<br />ID_arrondissement: " + feature.properties.id_a);
                }
            });


    var urlCP = 'http://localhost:8080/geoserver/Gestion-proprete/ows?service=WFS&version=1.0.0&viewparams=id_cp:' + code + '&request=GetFeature&typeName=Gestion-proprete:circuit_planifier&maxFeatures=1960&outputFormat=text/javascript&format_options=callback:getJson' + code + '&srsName=EPSG:4326';
 $.ajax({
        jsonp: false,
        url: urlCP,
        type: 'GET',
        dataType: 'jsonp',
        jsonpCallback: 'getJson' + code,
        success: function (data) {
            CPG.addData(data);
        }
 });


 if ($("#" + code).prop('checked')) {
     CPG.addTo(group);
     group.addTo(map);
 }
 else {
     map.removeLayer(group);
 }
}

In this code I have a query that take a parameter, id of feature then it make me to display features by id. For the display it work very well but to display the feature checked its not working. The problem is i want to display features by checking

enter image description here

3
  • Looks like you mainly want a custom L.control.layers?
    – ghybs
    May 10, 2016 at 18:51
  • no not control i use checkbox out of the map May 10, 2016 at 21:01
  • In your first code example you have in line 6: onchange="CP(this.id)"> - it probably should be something like onchange="CP("+this.id+")"> or onchange="CP("+feature.properties.id_cp+")">
    – chrki
    May 14, 2016 at 11:45

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Browse other questions tagged or ask your own question.