Databases
StackOverflow2013
Postsdbo
POJQuery Form Plugin File Upload using POST redirects to POST response
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POJQuery Form Plugin File Upload using POST redirects to POST response
    primarykey
    data
    text
    <p><strong>Please help guys, This one is a major BLOCKER!</strong></p> <p>I have a project that uses NodeJS + <a href="http://malsup.com/jquery/form/" rel="nofollow">jQuery Form Plugin</a> + Typescript in which I am trying to do a file upload. After the file upload the server sends a response to the POST message which renders on the screen. The file does get uploaded successfully and completely before the POST response renders on the screen. I expect the POST response to call the "success" function instead of having the page redirected to show the JSON response.</p> <p>Here's the code:</p> <pre><code>$(new ID().setAsRoot().selectId()).append( "&lt;form id=\"fileUploadForm\" accept-charset=\"utf-8\" method=\"post\" action=\"/upload\" enctype=\"multipart/form-data\"&gt;" + "&lt;input id = \"filename\" type=\"file\" name=\"userfile\" multiple=\"multiple\" /&gt;" + "&lt;button type=\"submit\" id = \"submitButton\"&gt; Upload &lt;/button&gt;&lt;/form&gt;"); var form = $("#fileUploadForm"); form.submit(function (e) { //e.preventDefault(); this.ajaxSubmit({ type: form.attr('method'), url: form.attr('action'), data: form.serialize(), success: function (data) { var x = JSON.parse(data); alert("Success : " + x); }, error: function (data) { var x = JSON.parse(data); alert("Error : " + x); } }); }); </code></pre> <p>the success function does not get called (which means the alert message doesn't show). The JSON data just gets rendered on the screen like this:</p> <pre><code>{ "path": "data\\cb3409f1cc234ec3f64b60d80be13a3e.html", "name": "feed.html" } </code></pre> <p>There is an error on the console that says:</p> <pre><code>Uncaught SyntaxError: Unexpected token : shortcut_manager.js:123 (anonymous function) shortcut_manager.js:123 (anonymous function) extensions::messaging:327 Event.dispatchToListener extensions::event_bindings:386 Event.dispatch_ extensions::event_bindings:371 Event.dispatch extensions::event_bindings:392 dispatchOnMessage </code></pre> <p>Here's the server side code that handles it. The server uses NodeJS formidable module.</p> <pre><code>public upload(req:express.Request, res) { var form = new formidable.IncomingForm(); var originalFileName:String; var filePath:String; form.uploadDir = this.directory; form.keepExtensions = true; form.type = 'multipart'; var fields = []; form .on("error", function (err) { }) .on("field", function (field, value) { }) .on("end", function () { res.send({ path: filePath, name: originalFileName }); }) .on("file", function (name, file:formidable.File) { originalFileName = file.name; filePath = file.path; }); form.parse(req); return; } </code></pre> <p>--Update--</p> <p>If I do <code>$.ajax</code> instead of <code>this.ajax</code>. The file does not upload. The browser console shows an error:</p> <pre><code>XMLHttpRequest cannot load http://localhost/. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8080' is therefore not allowed access. </code></pre>
    singulars
    1. PO
      singulars
      1. PTAnswer
    1. This table or related slice is empty.
    1. PTQuestion
    1. USa better oliver
    1. USEternallyCurious
    plurals
    1. PL
      singulars
      1. LTLinked
    2. PL
      singulars
      1. LTLinked
    1. PL
      singulars
      1. LTLinked
    2. PL
      singulars
      1. LTLinked
    1. This table or related slice is empty.
    1. PO
      singulars
      1. PTAnswer
    2. PO
      singulars
      1. PTAnswer
    3. PO
      singulars
      1. PTAnswer
    1. VO
      singulars
      1. POJQuery Form Plugin File Upload using POST redirects to POST response
      1. USEternallyCurious
      1. VTBountyStart
    2. VO
      singulars
      1. POJQuery Form Plugin File Upload using POST redirects to POST response
      1. This table or related slice is empty.
      1. VTUpMod
    3. VO
      singulars
      1. POJQuery Form Plugin File Upload using POST redirects to POST response
      1. This table or related slice is empty.
      1. VTUpMod
    1. CODon't you have to add a status code in your response ?
      singulars
      1. POJQuery Form Plugin File Upload using POST redirects to POST response
      1. USPaul D.
    2. COAdded status code to POST response - still won't work - Please see the updated code above. Thanks
      singulars
      1. POJQuery Form Plugin File Upload using POST redirects to POST response
      1. USEternallyCurious
    3. COOk, sorry that was just a quick idea. Another one is : using `$(this)` instead of `this` in your `submit` callback. I have the feeling you're accessing the HTML element. Do you get any error in the devloper console by the way ?
      singulars
      1. POJQuery Form Plugin File Upload using POST redirects to POST response
      1. USPaul D.
 

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