如何使用传单弹出窗口中的文本来完成ajax调用的URL?

时间:2018-03-12 15:45:00

标签: javascript jquery ajax leaflet

我想在弹出窗口中单击文本时进行ajax调用。小册子弹出窗口中的文本先前由不同的ajax调用设置。

以下是两个ajax调用的javascript。

$("#button").click(function() {
    var name = document.getElementById('searchterm').value
    var stuff = $.ajax({
        url: 'http://localhost:8080/demo/points/' + name,
        type: 'GET',
        dataType: 'json' ,      
    })
    .done(function( json ) {
        obj = JSON.parse(stuff.responseText);
        var n;
        for (n in obj) {
            var marker = omnivore.wkt.parse(obj[n].wkt).addTo(map);
            var id = JSON.stringify(obj[n].id)
            var link = $('<a href="#" class="showgraph">'+id+'</a>').click(function() {
                var moreStuff = $.ajax({
                    url: 'http://localhost:8080/demo/graph/'+id
                    type: 'GET',
                    dataType: 'json' ,  

                })
                .done(function( json ) {
                    obj2 = JSON.parse(moreStuff.responseText);
                    // create an array with nodes
                    edges = new vis.DataSet(obj2["edges"])
                    // create an array with edges
                    nodes = new vis.DataSet(obj2["nodes"])
                    // create a network
                    var container = document.getElementById('mynetwork');
                    // provide the data in the vis format
                    var data = {
                        nodes: nodes,
                        edges: edges
                    };
                    var options = {

                        nodes: {
                            shape: 'circle'
                        },
                        edges: {
                            length: 250
                        }

                    };

                    // initialize your network!
                    var network = new vis.Network(container, data, options);
                });
            });
            var div = $('<div />').text('Address UPRN: ').append(link)[0];
            marker.bindPopup(div);


        }   
    });
});

第二次调用完成后,使用vis.js添加图表视图。当我手动输入id时,这可以正常工作。

问题在于代码的这一部分

for (n in obj) {
        var marker = omnivore.wkt.parse(obj[n].wkt).addTo(map);
        var id = JSON.stringify(obj[n].id)
        var link = $('<a href="#" class="showgraph">'+id+'</a>').click(function() {
            var moreStuff = $.ajax({
                url: 'http://localhost:8080/demo/graph/'+id
                type: 'GET',
                dataType: 'json' ,  

        })

我认为,因为在将所有标记添加到地图时会在所有标记上设置ID。然后当我点击文本时,它使用最后一个ID来完成ajax调用的URL。

所以我猜我要问的是如何将弹出文本作为第二个ajax调用的一部分?或者如何预设每个弹出窗口使用的URL?

1 个答案:

答案 0 :(得分:0)

我使用.on()解决了问题,并将id值作为数据传递给函数。

    var link = $('<a href="#" class="showgraph">'+id+'</a>').on('click', { value: id }, function(x) {
        moreStuff = $.ajax({
            url: 'http://localhost:8080/demo/graph/' + x.data.value,
            type: 'GET',
            dataType: 'json' ,  

        })

这个link很有帮助,就像link

一样