Databases
StackOverflow2013
Postsdbo
POjavasctript removeEvent removes image when I click cancel
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POjavasctript removeEvent removes image when I click cancel
    text
    copied!<p>Disclaimer:I am not a javascript expert.</p> <p>Each time I upload an image and then I click on upload again but then click cancel the image i had previously uploaded gets deleted. Can someone please take a look at my javascript code and let me know how I can stop my script from removing the image i had previously uploaded when I click on cancel?</p> <p>jsfiddle:</p> <p>jsfiddle.net/yYc5Y</p> <p>HTML Form:</p> <pre><code>&lt;input type="file" size="45" name="uploadfile" id="uploadfile" class="file margin_5_0" onchange="ajaxUpload(this.form);" /&gt;&lt;!-- end image label and input --&gt; &lt;br /&gt; &lt;input name="4_images" type="checkbox" value="" /&gt; &lt;label&gt;Create 4 images&lt;/label&gt;&lt;br /&gt; &lt;label&gt;Thumbnail / Big Image&lt;/label&gt;&lt;br /&gt; &lt;!-- begin display uploaded image --&gt; &lt;div id="upload_area" class="corners align_center"&gt; please select image &lt;/div&gt;&lt;!-- begin display uploaded image --&gt; </code></pre> <p>Javascript code:</p> <pre><code> function $m(theVar){ return document.getElementById(theVar) } function remove(theVar){ var theParent = theVar.parentNode; theParent.removeChild(theVar); } function addEvent(obj, evType, fn){ if(obj.addEventListener) obj.addEventListener(evType, fn, true) if(obj.attachEvent) obj.attachEvent("on"+evType, fn) } function removeEvent(obj, type, fn){ if(obj.detachEvent){ obj.detachEvent('on'+type, fn); }else{ obj.removeEventListener(type, fn, false); } } // browser detection function isWebKit(){ return RegExp(" AppleWebKit/").test(navigator.userAgent); } // send data function ajaxUpload(form){ var detectWebKit = isWebKit(); var get_url = 'upload.php';// php file var div_id = 'upload_area';// div id where to show uploaded image var show_loading = '&lt;img src="img/loading.gif" /&gt;';// loading image var html_error = '&lt;img src="img/error.png" /&gt;';// error image // create iframe var sendForm = document.createElement("iframe"); sendForm.setAttribute("id","uploadform-temp"); sendForm.setAttribute("name","uploadform-temp"); sendForm.setAttribute("width","0"); sendForm.setAttribute("height","0"); sendForm.setAttribute("border","0"); sendForm.setAttribute("style","width: 0; height: 0; border: none;"); // add to document form.parentNode.appendChild(sendForm); window.frames['uploadform-temp'].name="uploadform-temp"; // add event var doUpload = function(){ removeEvent($m('uploadform-temp'),"load", doUpload); var cross = "javascript: "; cross += "window.parent.$m('"+div_id+"').innerHTML = document.body.innerHTML; void(0);"; $m(div_id).innerHTML = html_error; $m('uploadform-temp').src = cross; if(detectWebKit){ remove($m('uploadform-temp')); }else{ setTimeout(function(){ remove($m('uploadform-temp'))}, 1); } } addEvent($m('uploadform-temp'),"load", doUpload); // form proprietes form.setAttribute("target","uploadform-temp"); form.setAttribute("action",get_url); form.setAttribute("method","post"); form.setAttribute("enctype","multipart/form-data"); form.setAttribute("encoding","multipart/form-data"); // loading if(show_loading.length &gt; 0){ $m(div_id).innerHTML = show_loading; } // submit form.submit(); return true; } </code></pre>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

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