menardmam
menardmam

Reputation: 9986

jquery, json and xml

I have a database at zoho creator. They feed me a json of the database content. I have trouble to parse and display that data with jquery or php or in html

Question : So how do I capture json data, and save (convert) it to file as XML. With the xml file I can parse it with jquery xpath easily... the "file" will be a local database, as a backup (if saved)

anybod have clue on that ?


as request.. here is the link for the query -link-

getting a way to display data from var i need is the minimum i must have ! like prod_categorie or prod_nom

note :

  1. i can get help with any tutorial on how to get xml data from zoho
  2. any json to xml converter (jquery) out there ?????

Upvotes: 1

Views: 2601

Answers (3)

emkee
emkee

Reputation: 108

There are jQuery pluggins for such convertion, for example json2xml.

Upvotes: 2

system PAUSE
system PAUSE

Reputation: 38500

<html>
  <head>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
  </head>
  <body>
    <div id="Liste_output"></div>

    <script type="text/javascript">
    jQuery.ajax({
       url: "http://creatorexport.zoho.com/marcandremenard/application-lemieux/json/Liste_produits_View1/7GWhjVxYeNDePjPZnExCKy58Aqr21JX2hJEE6fAfgfkapEQnRjRd5RUy8wdjKuhmFEhJR9QRsBCUBjACAdSgmJNQSvxMt6geaMNC/",
       dataType: "json",
       success: function(data) {

          var Liste_div = jQuery("#Liste_output");
          var Liste_data = data["Liste_des_produits1"];
          for (var i=0; i<Liste_data.length; ++i) {
             var prod_i = Liste_data[i];
             Liste_div.append('<div>' +
                '<div>Nom: <span>' + prod_i["prod_nom"] + '</span></div>' +
                '<img src="/images/prod/'+ prod_i["prod_photo"] +'"/>' +
                '<div>Description: <span>' + prod_i["prod_desc"] + '</span></div>' +
                '<div>Ingredient: <span>' + prod_i["prod_ingredient"] + '</span></div>' +
                '<div>Odeur: <div class="odeur_cls"></div></div>' +
                '<div>Certification: <div class="cert_cls"></div></div>' +
                '</div>');
             var odeur_data = prod_i["prod_odeur"];
             for (var j=0; j<odeur_data.length; ++j) {
                jQuery('#Liste_output odeur_cls').eq(j).append('<span>' +
                   odeur_data[j] + '</span>' + (j<odeur_data.length-1 ? ', ' : ''));
             }
             var cert_data = prod_i["prod_certification"];
             for (var k=0; k<cert_data.length; ++k) {
                jQuery('#Liste_output cert_cls').eq(k).append('<div>' + cert_data[k] + '</div>');
             }
          }
       }
    });
    </script>
  </body>
</html>

This will not work from a local file. The HTML must be served from the same domain as the database query, that is, it must be served from http://creatorexport.zoho.com (you can put it in the app subfolder)

– OR –

You must read the zoho docs and find out how to do a "callback" (sometimes called "JSONP"). Usually this is done by adding something like ?callback=data to the end of the URL.

Upvotes: 2

nickf
nickf

Reputation: 546035

Firstly, Javascript has no file-output capability. The best it can do is send data back to a server for processing there -- so the "capture json data, and save it to file as XML" idea is out.

What problems in particular are you having with using JSON? As it gets converted to a native Javascript object, I find it quite easy to work with myself. Though, I can see that if you wanted to use XPath to query it, JSON is no help. You should still be able to get to whatever data you need, but it might be a bit more verbose.

In your example JSON:

{"Liste_des_produits1":[{"Added_Time":"28-Sep-2009 16:35:03",
"prod_ingredient":"sgsdgds","prod_danger":["sans danger pour xyz"],"prod_odeur"..

You could access the prod_danger property like this:

$.getJSON(url, function(data) {
   var danger = data.List_des_produits1[0].prod_danger; 
});

If you are having trouble getting the right path to a property, Firebug is a great help with this. Just call this:

$.getJSON(url, function(data) {
    console.log(data);
});

...and then you can browse through its properties in a tree-structure.

Upvotes: 2

Related Questions