Parsing data from web service. jQuery and Sharepoint 2007

Question

Hi,

i would just like to know if the way i am doing (parsing xml data) is correct.

From web service (hosted on sharepoint 2007) i retrive xml data. Web service does not retrive any parameters, just returns data. Now I'm using jQuery .ajax() function to go throu this data and output it.

XML is very deep inside (7 levels)

Just an example of what i meen deep. This is not the way my XML looks like.

     <data id="1">
            <item id="One value">
                <param id="Another value">
                    .... going deep inside ..
                </param>
                        <param id="Another value">
                    .... going deep inside ..
                </param>
                        <param id="Another value">
                    .... going deep inside ..
                </param>
            </item>
            <item id="One value">
                <param id="Some valu">
                    ... deep iside ...
                </param>
            </item>
            <item id="One value">
                <param id="Another value">
                    ....
                </param>
            </item>
        </data>
 <data id="1">
            <item id="One value">
                <param id="Another value">
                    .... going deep inside ..
                </param>
                        <param id="Another value">
                    .... going deep inside ..
                </param>
                        <param id="Another value">
                    .... going deep inside ..
                </param>
            </item>
            <item id="One value">
                <param id="Some valu">
                    ... deep iside ...
                </param>
            </item>
            <item id="One value">
                <param id="Another value">
                    ....
                </param>
            </item>
        </data>

I have to get all this data intu UL LI HTML tag. This is what i do.

$(xData.responseXML).find("data").each(function() {
               var data_item_id_value = $(this).attr('id');
               var data_item_id = $(this);
               data_menu += "<li>" + data_item_id_value + "</li>";

               $(xData.responseXML).find("item").each(function() {
                         ................ going under ......
               }
}

Is this the way how you would do it ?

Answer 1

JSON is an order of magnitude faster to consume on the client and a lot easier to traverse since it's basically a bunch of nested JavaScript arrays.

Answer 2

Any time someone is pulling back JSON/XML data and wants to insert it into a simple or complex HTML structure I always recommend a templating solution. The one that I choose to use is based on one by John Resig and being developed my some Microsoft talent. Available here. A good article can be found here.