Databases
StackOverflow2013
Postsdbo
PO
 

Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>There are several problems I found and wrestled with, but finally got some working code:</p> <pre><code>&lt;!DOCTYPE html&gt; &lt;html&gt; &lt;head&gt; &lt;/head&gt; &lt;body&gt; &lt;img id="a1" src="http://www.containernurseries.co.nz/images/contacticon.gif" width="18" height="37"/&gt; &lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"&gt;&lt;/script&gt; &lt;script&gt; $.getJSON("http://ip.jsontest.com", null, function (data) { console.log(data) }); $(document).ready(function () { ($('#a1')).mouseover(function (e) { ($('#a1').attr('src', 'http://www.containernurseries.co.nz/images/services.gif')); }).mouseout(function (e) { ($('#a1')).attr('src', 'http://www.containernurseries.co.nz/images/contacticon.gif'); }); }); &lt;/script&gt; &lt;/body&gt; &lt;/html&gt; </code></pre> <p>You can see it work here:</p> <p><a href="http://www.sanbarcomputing.com/flat/forumPosts/imgSrcType/imgSrcTypeNoComments.html" rel="nofollow noreferrer">http://www.sanbarcomputing.com/flat/forumPosts/imgSrcType/imgSrcTypeNoComments.html</a></p> <p>This code uses a service called "JSONTest" to get properly formatted JSON code. This returns an object (data) of key/value {ip: "xxx.xxx.xxx.xxx"} which shows your ip address. Here is the services website that I use to get the JSON response:</p> <p><a href="http://teamaqua.github.com/JSONTest/" rel="nofollow noreferrer">http://teamaqua.github.com/JSONTest/</a></p> <p>To see the console log output, just open a console in your browser (hit the F12 key, for instance, or open the FireBug plugin for FireFox. Drill down into the object to see the key/value pair properly formatted in the console.</p> <p>I fixed your code with the scr->src typo fix and some other things needing fixing:</p> <pre><code>&lt;!DOCTYPE html&gt; &lt;html&gt; &lt;head&gt; &lt;/head&gt; &lt;body&gt; &lt;img id="a1" src="http://www.containernurseries.co.nz/images/contacticon.gif" width="18" height="37"/&gt; &lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"&gt;&lt;/script&gt; &lt;script&gt; $.getJSON("http://www.containernurseries.co.nz/json/jsonPlantDetails.php", {plantSelected:"ARGYRANTHEMUM-POLLY"}, function (data) { ($('#a1')).attr('src', 'data:image/jpg;base64,' + data.plantDetail.Image); }); $(document).ready(function () { ($('#a1')).mouseover(function (e) { ($('#a1').attr('src', 'http://www.containernurseries.co.nz/images/services.gif')); }).mouseout(function (e) { ($('#a1')).attr('src', 'http://www.containernurseries.co.nz/images/contacticon.gif'); }); }); &lt;/script&gt; &lt;/body&gt; &lt;/html&gt; </code></pre> <p>You can see it (possibly) fail here:</p> <p><a href="http://www.sanbarcomputing.com/flat/forumPosts/imgSrcType/imgSrcType.html" rel="nofollow noreferrer">http://www.sanbarcomputing.com/flat/forumPosts/imgSrcType/imgSrcType.html</a></p> <p>I get a cross-domain error in Chrome, and it seems to fail silently in IE and FireFox:</p> <blockquote> <p>XMLHttpRequest cannot load <a href="http://www.containernurseries.co.nz/json/jsonPlantDetails.php?plantSelected=ARGYRANTHEMUM-POLLY" rel="nofollow noreferrer">http://www.containernurseries.co.nz/json/jsonPlantDetails.php?plantSelected=ARGYRANTHEMUM-POLLY</a>. Origin <a href="http://www.sanbarcomputing.com" rel="nofollow noreferrer">http://www.sanbarcomputing.com</a> is not allowed by Access-Control-Allow-Origin.</p> </blockquote> <p>Here is a good post that talks about one way to fix this (changing it to JSONP), but since your server returns JSON, not JSONP, it does not work either (I tried):</p> <p><a href="https://stackoverflow.com/questions/9327218/access-control-allow-origin-not-allowed-byi">stackoverflow: access-control-allow-origin-not-allowed-by</a></p> <p>You would need to return the result in the form of a JSONP JavaScript executable function from the server, I believe. To get a JSONP request sent, you would change this line:</p> <pre><code>$.getJSON("http://www.containernurseries.co.nz/json/jsonPlantDetails.php", </code></pre> <p>To this:</p> <pre><code>$.getJSON("http://www.containernurseries.co.nz/json/jsonPlantDetails.php?callback=?", </code></pre> <p>jQuery then would automatically produce a JSONP request for you. It works, but since the result is not executable JavaScript, you get the following error in Chrome:</p> <blockquote> <p>Uncaught SyntaxError: Unexpected token :</p> </blockquote> <p>Since I think Chrome is trying to execute the JSON as a function, which it is not.</p> <p>Changes need to be made to the server, I believe, to get this working cross-domain, if you need that.</p> <p>Here is a good article on cross-domain issues:</p> <p><a href="https://developer.mozilla.org/en-US/docs/HTTP_access_control" rel="nofollow noreferrer">https://developer.mozilla.org/en-US/docs/HTTP_access_control</a></p>
    singulars
    1. This table or related slice is empty.
    1. POChanging src on img tag, can't make it work
      singulars
      1. PTQuestion
    1. PTAnswer
    1. USCommunity
    1. USAeoril
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. POChanging src on img tag, can't make it work
      singulars
      1. PTQuestion
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload