Note that there are some explanatory texts on larger screens.

plurals
  1. POAJAX POST $_FILES with onclick = "return false;"
    text
    copied!<p>I've been looking to do a photo upload form using a current AJAX script.</p> <p>At present I have the html form with the file input, on submit I have an onclick event with "PostForm(); return false;"</p> <p>This fires off to a process.php script where the magic happens (and I have working). However, I have a success and fail message that usually pops up with the process script returning a "1" or "0" value.</p> <p>I can get the form working just using "PostForm();", however the failure message appears straight away, followed by being redirected to the process page which displays "1". If I add return false; into the onclick event I get a success message however no file is uploaded.</p> <p>I assume that the "return false;" command is preventing the file uploading. Is there any way to possibly show a progress bar, or a spinner whilst it uploads and then display the success / fail message?</p> <p>Thanks</p> <p><strong>Update 1</strong><br> jQuery Code</p> <blockquote> <pre><code> PostForm = function() { $('.text').attr('disabled','true'); var data = $('form').serialize(); $.ajax({ type: 'POST', url: "/lib/mp-update.php", data: data, cache: false, success: function(html) { if(html==1) { $('#success').hide(); $('#success').removeClass(); $('#success').slideUp('50000'); $('form').fadeOut('50000', function() { $('#success').fadeIn('50000'); }); } else { $('#fail').hide(); $('#fail').removeClass(); $('#fail').slideUp('50000'); $('form').fadeOut('50000', function() { $('#fail').fadeIn('50000'); }); } } }); return false; } }); </code></pre> </blockquote> <p>PHP does a standard switch statement to identify which form has been sent from a hidden form value.</p>
 

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