Question

I have an odd problem with the following:

function loadTextbox(jsonUrl,divId){
    $.getJSON(jsonUrl, function(json) {
        $('#' + divId).html('<h2>'+json.heading+'</h2>');
        alert(json.config.headingConfig);
        $('#' + divId).children().css(json.config.headingConfig);
    })
}

The alert above returns: {color: ‘white’, fontFamily:’Arial, Times, serif’} However, the format of the text does not change.

Now here is the odd part: If I do this:

function loadTextbox(jsonUrl,divId){
        $.getJSON(jsonUrl, function(json) {
            $('#' + divId).html('<h2>'+json.heading+'</h2>');
            alert(json.config.headingConfig);
            $('#' + divId).children().css({color: 'white', fontFamily:'Arial, Times, serif'});
        })
    }

It works fine… The text format is Arial font and white. I am baffled… which probably means there is a very simple answer, any ideas?

Answer 1

It looks like your json.config.headingConfig contains a JSON string.

You need to convert it to an actual object by calling $.parseJSON.