Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>the issue was with the js script as the image was uploaded the js function had tried to bind to a non existing id which is why the js script failed to run. The js in the file above had to be put into the js function at the end that was loading in the image, so after the image had loaded in then the jquery binded the id to the jcrop.</p> <p>eg old script.</p> <pre><code>&lt;script type="text/javascript"&gt; $(document).ready(function () { $("#formsubmit").click(function (event) { event.preventDefault(); var iframe = $('&lt;iframe name="postiframe" id="postiframe" style="display: none" /&gt;'); $("body").append(iframe); var form = $('#theuploadform'); form.attr("action", "uploader.php"); form.attr("method", "post"); form.attr("enctype", "multipart/form-data"); form.attr("encoding", "multipart/form-data"); form.attr("target", "postiframe"); form.attr("file", $('#userfile').val()); form.submit(); $("#postiframe").load(function () { iframeContents = $("#postiframe")[0].contentWindow.document.body.innerHTML; $("#textarea").html(iframeContents); $("#postiframe").remove(); $(document).find('#postiframe').remove(); }); }); }); &lt;/script&gt; &lt;script type="text/javascript"&gt; $(function(){ $('#cropbox').Jcrop({ aspectRatio: 1, onSelect: updateCoords }); }); function updateCoords(c) { $('#x').val(c.x); $('#y').val(c.y); $('#w').val(c.w); $('#h').val(c.h); }; function checkCoords() { if (parseInt($('#w').val())) return true; alert('Please select a crop region then press submit.'); return false; }; &lt;/script&gt; </code></pre> <p>turns into:</p> <pre><code>&lt;script type="text/javascript"&gt; $(document).ready(function () { $("#formsubmit").click(function (event) { event.preventDefault(); var iframe = $('&lt;iframe name="postiframe" id="postiframe" style="display: none" /&gt;'); $("body").append(iframe); var form = $('#theuploadform'); form.attr("action", "uploader.php"); form.attr("method", "post"); form.attr("enctype", "multipart/form-data"); form.attr("encoding", "multipart/form-data"); form.attr("target", "postiframe"); form.attr("file", $('#userfile').val()); form.submit(); $("#postiframe").load(function () { iframeContents = $("#postiframe")[0].contentWindow.document.body.innerHTML; $("#textarea").html(iframeContents); $("#postiframe").remove(); $(document).find('#postiframe').remove(); //attempt at joining $(function(){ $('#cropbox').Jcrop({ aspectRatio: 1, onSelect: updateCoords }); }); function updateCoords(c) { $('#x').val(c.x); $('#y').val(c.y); $('#w').val(c.w); $('#h').val(c.h); }; function checkCoords() { if (parseInt($('#w').val())) return true; alert('Please select a crop region then press submit.'); return false; }; }); }); }); &lt;/script&gt; </code></pre>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    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

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