[GIS] Json not loading from GeoServer into Leaflet

geoserverjqueryleafletwfs

I'm creating an web map application using Geoserver and Leaflet. I'm trying to load a few Json feature through an WFS service.The problem is that nothing is being displayed on the final map, the Geoserver console emits the following meassage: [info.json] – about to encode JSON

What makes me to believe that there is nothing wrong with the service.

Here is the code.

var map = L.map('map').setView([39.752171, -104.998817], 17);

L.tileLayer('https://{s}.tiles.mapbox.com/v3/{id}/{z}/{x}/{y}.png', {
        maxZoom: 18,
        attribution: 'Map data &copy; <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, ' +
            '<a href="http://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ' +
            'Imagery © <a href="http://mapbox.com">Mapbox</a>',
        id: 'examples.map-20v6611k'
    }).addTo(map);

var geojsonLayer = new L.GeoJSON();

function handleJson(data) {
console.log(data)
geojsonLayer.addData(data);
}

var geoJsonUrl = "http://localhost:8080/geoserver/PastDenver/ows?service=WFS&version=1.0.0&request=GetFeature&typeName=PastDenver:dataset1&maxFeatures=50&outputFormat=text/javascript&format_options=callback:getJson"

$.ajax({
url : geoJsonUrl,
dataType : 'json',
jsonpCallback: 'getJson',
success : handleJson
});

map.addLayer(geojsonLayer);

Most of this code I took from examples from here, I have no idea what may be happening.

Does the version of JQuery matters from this AJAX? I'm using this link https://code.jquery.com/jquery-2.1.3.js

Best Answer

Try to change the dataType in your ajax request to 'jsonp'

The documentation indicates

callback—Applies only to the JSONP output format.