JQuery XML Parsing and HTML rendering

classic Classic list List threaded Threaded
1 message Options
Reply | Threaded
Open this post in threaded view

JQuery XML Parsing and HTML rendering

Hi All,
Greetings!! I am new to JQuery and hence i seek experts assistance for a solution.
In the below XML i have the Category "Sales" 2 times and "Products" 4 times. I need to group those Categories as single "Sales" and "Products" and the corresponding number of URLMenu should come under those single categories.

          <z:row Category="Sales " URLMenu="http://www.sales.com" /> 
          <z:row Category="Products" URLMenu="http://www.products.com" /> 
          <z:row Category="Sales "URLMenu="http://www.service.com" /> 
          <z:row Category="Products" URLMenu="http://www.Financial.come" /> 
          <z:row Category="Products" SubCategory="International" URLMenu="United States" /> 
          <z:row Category="Products" SubCategory="International" URLMenu="Australia" /> 

JQuery Function
        $(document).ready(function () {
                var thisHtml = '';    
                var url = 'Data.xml';
                $.get(url, function (d) {
                    thisHtml += '<ul>';
                    $(d).find('z\\:row').each(function () {
                            var xml_category = $(this).attr('Category');
                            var xml_URLwMenu = $(this).attr('URLMenu');
                            thisHtml += '<li>' + xml_category + '</li><ul><li>' + xml_URLwMenu + '</li></ul>';
                    thisHtml += '</ul>';

Expected Result:
        • Sales
         o Sales.com  
         o Services.com
        • Products  
         o Products.com
         o Financial.com  
         o International  
             United States  
             Australia

Also note that "Products" has subcategory "International" in XML and it also needs to be listed.

Could you please help me in re-writing the JQuery function to support the expected result?

As of now i am getting all the XML "category" with the number of times the "Products" and "Sales" are present.

I am new to JQuery and have been breaking my heads for days. Your help will be highly appreciated.