| Both sides previous revisionPrevious revisionNext revision | Previous revision |
| v:0.7.0:advanced:json [2010/11/01 21:22] – added note about updating qty via JSON foxybrett | v:0.7.0:advanced:json [2017/04/26 07:02] (current) – external edit 127.0.0.1 |
|---|
| |
| ===== What is JSON? ===== | ===== What is JSON? ===== |
| ''JSON'' stands for JavaScript Object Notation ((More about JSON on [[http://en.wikipedia.org/wiki/JSON|Wikipedia]] and [[http://json.org/|json.org]].)), and can be thought of as a very flexible method to store data. Conceptually it is similar to XML, but since it's actually a javascript object it's trivially easy to work with in javascript (whereas XML requires much more work to process by javascript). | ''JSON'' stands for JavaScript Object Notation ((More about JSON on [[wp>JSON|Wikipedia]] and [[http://json.org/|json.org]].)), and can be thought of as a very flexible method to store data. Conceptually it is similar to XML, but since it's actually a javascript object it's trivially easy to work with in javascript (whereas XML requires much more work to process by javascript). |
| |
| FoxyCart's JSON looks like this: | FoxyCart's JSON looks like this: |
| |
| ===== What is JSONP? ===== | ===== What is JSONP? ===== |
| ''JSONP'' is a magical tool that allows for relatively easy cross-domain javascript calls, which is impossible in most other ways (barring HTML5 functionality). We recommend [[http://en.wikipedia.org/wiki/JSON#JSONP|getting a thororugh understanding]], but the basic idea is this: You make a call to an endpoint (your FoxyCart cart) and you get back ''JSON'' //wrapped inside of a function call//. The reason for the function is so that your javascript can actually //do something// with the JSON you retrieve. | ''JSONP'' is a magical tool that allows for relatively easy cross-domain javascript calls, which is impossible in most other ways (barring HTML5 functionality). We recommend [[wp>JSON#JSONP|getting a thororugh understanding]], but the basic idea is this: You make a call to an endpoint (your FoxyCart cart) and you get back ''JSON'' //wrapped inside of a function call//. The reason for the function is so that your javascript can actually //do something// with the JSON you retrieve. |
| |
| jQuery [[http://api.jquery.com/jQuery.getJSON/|makes this easy]], so let's try a quick example of retrieving the total number of products and the total cart price, less any discounts. | jQuery [[http://api.jquery.com/jQuery.getJSON/|makes this easy]], so let's try a quick example of retrieving the total number of products and the total cart price, less any discounts. |
| |
| ===== Modifying or Removing Items with JSONP ===== | ===== Modifying or Removing Items with JSONP ===== |
| If you want to update the quantity of a specific item, send this: | If you want to update the **quantity** of a specific item, send this: |
| <code> | <code> |
| &cart=update&quantity=<new quantity>&id=<product id from json> | &cart=update&quantity=<new quantity>&id=<product id from json> |
| Note that the ''cart=update'' is required for these operations to function. | Note that the ''cart=update'' is required for these operations to function. |
| |
| | Unfortunately, modifying products in the cart beyond the quantity is not currently possible. |
| | |
| | |
| | ===== Adding a Coupon or Session Value Automatically Using JSONP ===== |
| | If you want to add a coupon code, affiliate tracking value, member group, user ID, or any other value to your visitor's FoxyCart session automatically and in the background you could use something like this: |
| | <code html> |
| | <script type="text/javascript" charset="utf-8"> |
| | jQuery(document).ready(function(){ |
| | setTimeout(function() { |
| | if (typeof(FC.json.coupons) == "undefined") { |
| | jQuery.getJSON('https://'+storedomain+'/cart?'+fcc.session_get()+'&coupon=YOUR_COUOPON_CODE&output=json&callback=?', function(data) { |
| | // console.info(FC.json.coupons.length); |
| | }); |
| | } |
| | }, 1500); |
| | }); |
| | </script> |
| | </code> |
| | |
| | That uses a ''setTimeout'' to wait 1.5 seconds((While this shouldn't need a ''setTimeout'', as of v0.7.0 it does. We'll be updating that in future versions.)), then check to see if a value already exists in the JSON (in this case we're checking to see if any coupons have been added to the session). If no that node in the ''FC.json'' object is undefined, we will use a JSONP call to add the coupon to the session. This is just an example, but hopefully it's useful in crafting your own scripts. |
| |
| ===== Important Notes for JSON(P) Implementations ===== | ===== Important Notes for JSON(P) Implementations ===== |
