Question

I have the following code:

$("#map4").gMap({ markers: [ 
                             { address: "Tettnang, Germany",
                               html: "The place I live" },
                             { address: "Langenargen, Germany",
                               html: "_address" }],
                  address: "Braitenrain, Germany",
                  zoom: 10 });

The markers array needs to be dynamically populated. I’m calling ajax and returning with a json array. So I have to iterate through it and store just the address and html (html is a concatenated string of multiple array elements).

So here is my full code:

var markers = new Object();
$.post(
    custom.ajaxurl, 
    { 
        action:'get_current_events'
    }, 
    function(jdata) {
        $.each(jdata, function(i, data){
            markers += "{ 'address': '" + data.address + "', 'html': '" + data.html + "'},";
        });

        $('#map_canvas').gMap({markers: markers.marks ,address: jdata[0].address, zoom: 10 });

Answer 1

markers seems to be an array of objects. I don’t understand why you are doing string concatenation. You can use $.map ^[docs] to extract the necessary information from your response:

$.post(custom.ajaxurl, {action:'get_current_events'}, function(jdata) {
        var markers = $.map(jdata, function(data) {
            return {address: data.address, html: data.html};
        });
        $('#map_canvas').gMap({
            markers: markers,
            address: jdata[0].address,
            zoom: 10 
        });
});

The MDN JavaScript Guide is a very good introduction to JavaScript.