0
 $(".btnSavePurpose").click(function(e){
       e.preventDefault();
       var item=$(this);
       $.post("url", 
                         item.closest("form").serialize(), function(data){
           if(data.Status=="Success")
           {
             //Let's replace the form with messsage                
             alert("Updated Successfully");
           }    
           else
           {
              alert(data.ErrorMessage);
           }

       });   
    });

I want to post my form using ajax. I have used $post() jquery function. I am getting all data without file which is uploaded. I have added enctype to form. I am getting Request.File["file"] null. How I can retrive uploaded file

<form method="post" id="profile-form" enctype="multipart/form-data">
   <table>
     <tr>
        <td style="width: 25%">
         Profile Name<span class="Require">&nbsp;*</span>
         </td>
         <td style="width: 10%">
          :
         </td>
          <td style="width: 70%">@Html.TextBoxFor(m => m.ProfileName, new { @class = "formTextBox" })
          </td>
   </tr>
   <tr>
       <td>
          My Ocupation<span class="Require">&nbsp;*</span>
       </td>
       <td>
       :
       </td>
       <td>@Html.TextBoxFor(m => m.Ocupation, new { @class = "formTextBox" })
       </td>
  </tr>
  <tr>
      <td>
         Upload New Profile Photo
      </td>
      <td>
         :
      </td>
      <td>
            <input type="file" name="file" id="file" runat="server" accept="gif|jpg|png|jpeg|bmp" />                                                       
      </td>
  </tr>
 </table>
 <input type="submit" id="btnSubmit" value="Submit" class="formButton" />
 </form>
GautamD31
  • 28,552
  • 10
  • 64
  • 85
user
  • 793
  • 4
  • 14
  • 23

2 Answers2

0

try this example
html

<form id="form1" runat="server" enctype="multipart/form-data">
 <input type="file" id="myFile" name="myFile" />
 <asp:Button runat="server" ID="btnUpload" OnClick="btnUploadClick" Text="Upload" />
</form>

.net

 protected void btnUploadClick(object sender, EventArgs e)
    {
        HttpPostedFile file = Request.Files["myFile"];

        //check file was submitted
        if (file != null && file.ContentLength > 0)
        {
            string fname = Path.GetFileName(file.FileName);
            file.SaveAs(Server.MapPath(Path.Combine("~/App_Data/", fname)));
        }
    }

how to write js take a look here Using jQuery to send data from a multipart/form-data through ajax

Community
  • 1
  • 1
Anton Baksheiev
  • 2,211
  • 2
  • 14
  • 15
0

I'm afraid what you're trying to do is not this simple. You cannot read a file with JavaScript. You have no access to the file system whatsoever. This means that you cannot post a file with AJAX. (Well, it can be done with HTML5 - see: How can I upload files asynchronously?)

There's a lot of ways to go about the problem to solve it, something you can hammer together rather quickly on your own is to post the file in an iframe. I'd recommend using a jQuery plugins for this, for example http://blueimp.github.com/jQuery-File-Upload/.

Community
  • 1
  • 1
Zut
  • 639
  • 1
  • 5
  • 12