It's possible to dynamically update data and information on websites using publicly accessible data via the HTTP API.
For example, you might want to have the following:
We've adopted 389 animals!
You can populate the number dynamically via the HTTP API.
To do this via the RescueGroups.org Website service, you'll need both a Custom Code Snippet, and a web page with some HTML included.
Create a Custom Code Snippet and include the following JavaScript code:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js" type="text/javascript"></script> <script src="https://s3.amazonaws.com/filestore.rescuegroups.org/scripts/noncvs/jquery-json.js" type="text/javascript"></script> <script> var thing = {"apikey":"****","objectType":"animals","objectAction":"publicSearch","search":{"calcFoundRows":"Yes","resultStart":0,"resultLimit":0,"fields":["animalName"],"filters":[{"fieldName":"animalStatus","operation":"equals","criteria":"Adopted"},{"fieldName":"animalOrgID","operation":"equals","criteria":"****"}]}}; var encoded = $.toJSON(thing) $.ajax({ url: "https://api.rescuegroups.org/http/json/?data=" + encoded, dataType: "jsonp", success: function(data) { if (data.foundRows) document.getElementById('adoptedPetsCount').innerHTML = data.foundRows; }, error: function(xhr, status, error) { console.log('error'); } }); </script> |
Be sure to replace the asterisks in the example above with your public API Key for the apikey value and your account number for the animalOrgID value. |
Edit the web page or content area where you would like the dynamic data to appear. You'll need to do two things:
For the container, you could use the following HTML code (following the example query for adopted animals above):
We've adopted <span id="adoptedPetsCount">a lot of</span> pets! |
So once you add it all to the web page, it might look something like this:
<p>{s3182code1999/}</p> <p>We've adopted <span id="adoptedPetsCount">a lot of</span> pets!</p> |
The example above uses the JavaScript code "document.getElementById('adoptedPetsCount').innerHTML" to change the content of the adoptedPetsCount element to the value that it received from the HTTP API.