Question

I have below code that reads file name after browse and sends it to another page using POST. if i have alert after $.post, then it works fine. If I remove the alert message, then post is not forwarding the file name to another page.

<input type="file" name="fileupload" id="fileupload" value="">

// Jquery code

$("#fileupload").change(function() {
    if ($("#fileupload").val().length > 0) {
        $.post("ReadExcel.jsp", {
            filename: $("#fileupload").val(),
            processId: < %= processId % >
        });
        alert($("#fileupload").val()); // **If I remove this alert, then the code doesn't works** 
    }
    location.reload();
});​

Answer 1

I had a hard time posting file data with jQuery so I made a form and added it with an i frame and use the good old form methods. I’m not sure what you exactly trying to achieve, (post the file data, or just the filename) but anyhow here some tips.

My bet would be that when you put the alert, the script pause the time you click on OK so it has time to actually get his response from the post. As you take it off, the script continue executing before the client receive his answer.

Modify your code so your next action is in the callback, (will run after getting the response); $.post(filename, value, callback);

This code should work:

<input type="file" name="fileupload" id="fileupload" value="">
// Jquery code
   $("#fileupload").change(function() {
   if($("#fileupload").val().length > 0) {    

       $.post("ReadExcel.jsp", {
            filename: $("#fileupload").val(), 
            processId: <%=processId%>
       },function(data){
             location.reload();          //THIS IS THE CALLBACK 
       });

 alert($("#fileupload").val());  // **If I remove this alert, then the code doesn't works**     
     }    
});

Notice the function(data){} in the 3rd argument. data represent the returned value, so you can use it to verify if you script ran properly. You simply have to return a value, can be anything, i use 0 and 1 as in true or false.

So by changing the call back with

if(data ==1) location.reload();
else alert("something went wrong");

You will be able to notify the user is something goes wrong.

jQuery post is an amazing thing, callback is great tools too..enjoy