Symphony.

Greetings all,

As a recent convert from wordpress to symphony, it’s been quite a ride so far developing my first website in symphony - I’m really enjoying it!

The problem I’m facing at the moment is proving to be quite painful. Basically I’m trying to output JSON from a page, for use in an ajax request. However, when the JSON returns to the browser, it just doesn’t want to work.

I’ve been doing some digging and I’m wondering whether it has something to do with the content-type of the returned data? In my XSL file I’m setting the output method as follows:

<xsl:output method="text" media-type="text/plain" />

But when I examine the XHR request in Firebug it says that the returned data has a content-type of “text/html”??

Here is the JSON (the website is for a music festival):

({ artist_detail: {
                    artist_id: "155",
                    artist_name: "Feature Artist 2", 
                    artist_genre: "Blues",
                    artist_biography: "<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>",
                    artist_website: "",
                    artist_myspace: "http://www.myspace.com/test4",
                    artist_youtube: "",
                    artist_large_photo: {
                        photo_size: "87 kb",
                        photo_path: "/files/artists",
                        photo_type: "image/jpg",
                        photo_filename: "artist4.jpg",
                        photo_width: "640",
                        photo_height: "200"
                    },
                    artist_small_photo: {
                        photo_size: "24 kb",
                        photo_path: "/files/artists",
                        photo_type: "image/jpg",
                        photo_filename: "artist4_small.jpg",
                        photo_width: "315",
                        photo_height: "98"
                    }
                }
            });

Interestingly, if I remove the “artist_biography” data, the JSON works…

Any help would be much appreciated!

Hi Tim, welcome to the forum!

I think the problem might be that while the XSLT processor is returning as plain text, when the content is sent back through PHP, Symphony is sending it as text/html instead, as a regular web page.

You could try installing the Content Type Mappings extension which allows you to define content types in your manifest/config.php and then use in the Page Type field when editing a Page. This post suggests application/json as a MIME type.

Alternatively it could be because the artist_biography field contains HTML tags, but I can’t see that being an issue.

Thanks Nick,

I saw that post while doing some research on google this morning, but haven’t yet seen that extension. I’ll have to give that a go today.

Thanks for the help!

I don’t have any experience with JSON, but I think Nick is on to something because I had the same problem when doing the same thing but with XML. Fortunately, XML is a native page type that can be selected in Symphony. Anyways, I feel your pain and would follow up Nick’s suggestion to rule out first.

The content/MIME type is important for AJAX requests: when the XHR object receives the response it determines the type (text or XML) to populates the relevant responseText or responseXML properties — so you gotta know which it’s being returned as to use it!

What made it harder for me to figure out the mistake was that one browser was forgiving (Firefox) but one was not (Internet Explorer).

@Tim, let us know what you find out as I’m sure it will be helpful to others.

Ok, I have it working!

What I did was:

1. Upgraded to Symphony 2.0.6;
2. Installed extension Content Type Mappings;

3. Created a mapping in my config.php file:

   ‘json’ => ‘application/json’,

4. Updated the “Page Type” for my page to be “json”;

5. Updated my javascript to strip the newline characters from the output (for some reason it was failing over this too:

   var jsonData = eval(‘(’ + data.replace(/\n/g, ”) + ‘)’);

6. Ensured the JSON keys were enclosed in quotations.

As such, my JSON now looks like:

{ "artist_detail": {
                    "artist_id": "155",
                    "artist_name": "Feature Artist 2", 
                    "artist_genre": "Blues",
                    "artist_biography": "<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>",
                    "artist_website": "",
                    "artist_myspace": "http://www.myspace.com/test4",
                    "artist_youtube": "",
                    "artist_large_photo": {
                        "photo_size": "87 kb",
                        "photo_path": "/files/artists",
                        "photo_type": "image/jpg",
                        "photo_filename": "artist4.jpg",
                        "photo_width": "640",
                        "photo_height": "200"
                    },
                    "artist_small_photo": {
                        "photo_size": "24 kb",
                        "photo_path": "/files/artists",
                        "photo_type": "image/jpg",
                        "photo_filename": "artist4_small.jpg",
                        "photo_width": "315",
                        "photo_height": "98"
                    }
                }
            }

Thanks for all your help guys!

Great :-) Glad it’s working.

tim.cromwell: Have you tried creating your JSON using the XML to JSON Utility? :-)

It won’t prevent the problems you were talking about but it might add another abstraction layer, making it easy to modify the JSON you’re using for future changes.

Awesome, thanks for the follow-up!

@phoque: I’m testing out the XML to JSON util at the moment. I’ve come across a couple of typos and a bug that means it doesn’t work out of the box.

• Line 18 should be </xsl:call-template> not </xsl:cal.
• Line 22 should be <xsl:param name="xml" /> not <xsl:param name="$xml" />

Other than that it seems to work great.

I’ve created a new version of this utility that has support for outputting attributes. It’s at http://gist.github.com/190115. I haven’t tested it extensively but it seems to work for me.

I’ve come across a couple of typos and a bug that means it doesn’t work out of the box.

Fixed, thanks!

I’ve created a new version of this utility that has support for outputting attributes.

Interesting, can you give me an example of how attributes are transformed? And what exactly is mode="json-stringify"? :-)

Interesting, can you give me an example of how attributes are transformed?

{
    "section": {
        "entry": {
            "@attributes": {
                "position": "0",
                "result": "error"
            },
            "message": "Entry encountered errors when saving.",
            "publication": {
                "@attributes": {
                    "type": "missing",
                    "message": "'Publication' is a required field."
                }
            },
            "post-values": {
                "title": "Post value test"
            }
        }
    }
}

And what exactly is mode="json-stringify"? :-)

Uh, a mistake :p I’ve fixed it now.

Ah, looking good.

Although I am not sure: the element publication doesn’t have a value, should it still be “null” in addition to the attributes?

Perhaps, I’m not all that well versed in JSON syntax but I don’t think it has to be. Unless I’m mistaken is there any point in having it be null versus undefined?

That’s why I’ve left attributes out… :-)

It’s easier to check against “null” or “undefined” than to check against “nothing else but attributes”. I will think about it a little bit (everybody else is invited to think about it too) on how to incorporate your improvements into the util.

What about another param to dis/enable attributes?

That’s why I’ve left attributes out… :-)

Heh, fair enough. I thought you could perhaps do something like:

"publication" : {
    "@attributes" : {
        "type" : "missing",
        "message" : "'Publication' is a required field."
    },
    "value" : "the value or null would go here"
}

Thoughts?

I’ve amended the utility so it should now output the node value or null if there isn’t one. It should now generate something like:

"fieldname" : {
    "@attributes" : {
        "type" : "missing",
        "message" : "'fieldname' is a required field."
    },
    null
}

Edit: That above syntax is invalid, now outputs the value (or not) as

"fieldname" : {
    "@attributes" : {
        "type" : "missing",
        "message" : "'fieldname' is a required field."
    },
   "value" : null
}

FYI: I’ve updated it again, it should now do the same checking for strings vs numbers on attributes that phoque’s function does on normal values.

Edit: I’ve also discovered that Safari chokes on the @attribute syntax—it’s fine in Firefox—so I’ve updated the utility to output _attributes and _value now.