CODEWITHSUNDEEP
javascriptjspspring-mvc
Dexa
Dexa

Reputation: 99

How to get data to js from JSP

I have a problem and I wonder could anyone help me. In a result I want to make some small maps with a different GPS track on them. But I have a problem with getting data. I need to get GPS track from a server. Then extract coordinates of all dots which belong to this track and put this data in js(on the map). I'll show: Here I have a controller:

@Controller
public class TracksGeopointsController {

    @Autowired
    private IndexGeopointsService indexGeopointsService;
    @Autowired
    private TracksGeopointsService tracksGeopointsService;
    @Autowired
    private FileService fileService;
    @Autowired
    private MySaxParser mySaxParser;

    @RequestMapping(value = TracksGeopointsRoutes.TRACKS, method = RequestMethod.GET)
    public String tracks(Model model){

        List<TracksGeopointsDoc> tracks = tracksGeopointsService.findAllTracks();
        Map<ObjectId, List<DotGeopointsDoc>> dotsMap = new HashMap<ObjectId, List<DotGeopointsDoc>>();
        for (TracksGeopointsDoc track : tracks){

            try {
                List<DotGeopointsDoc> dots = tracksGeopointsService.getAllTrackDots(track.getId());
                dotsMap.put(track.getId(), dots);
                model.addAttribute("dotsMap", dotsMap); //here I put data to a model to transport it to JSP
                model.addAttribute("tracks", tracks); //here I put data to a model to transport it to JSP
            } catch (TrackNotExistException e) {
                e.printStackTrace();
            }

        }

        Breadcrumbs breadcrumbs = indexGeopointsService.breadcrumbs();
        breadcrumbs.setCurrentPageTitle("GPS треки");

        model.addAttribute("breadcrumbs", breadcrumbs);

        return "com.ub.geopoints_test.tracks";

    }
}

And my JSP looks like that:

<div class="row">
    <div class="col-md-12">
        <c:forEach var="track" items="${tracks}" varStatus="count"> //I know how to extract data from model above - ${tracks}
            <script>
                var map = L.map('map');
                // create the tile layer with correct attribution
                var osmUrl='http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png';
                var osmAttrib='Map data © <a href="http://openstreetmap.org">OpenStreetMap</a> contributors';
                var osm = new L.TileLayer(osmUrl, {minZoom: 1, maxZoom: 12, attribution: osmAttrib});

                map.addLayer(osm);
                L.Routing.control({
                 waypoints: [

                 L.latLng(57.74, 11.94), // here I want to put data that I gave to model. If it was not js, I'll do this: L.latLng(${dotsMap.get(track.id).lat}, ${dotsMap.get(track.id).lat}) But I don't know how can I do it with js
                 L.latLng(57.6792, 11.949),
                 L.latLng(57.65, 11.888)
                 ]
                 }).addTo(map);
            </script>
        </c:forEach>
    </div>
</div>

Please, could anyone help me. I really don't know how I can do it.

Upvotes: 0

Views: 1566

Answers (1)

Jahangir Alam
Jahangir Alam

Reputation: 311

In the same jsp page if you write js code you can store model value in java script variable. For example :

var varName = ${modelName.variableName}

So you can render any model value in the javascript code block in the same jsp.

Upvotes: 1

Related Questions