title: How to upload a file without reloading the whole page in mvc3?
body: <p>I have been working with MVC for the past few days.</p>
  
  <p>I have a problem in one of my pages, i.e I have a page where q user enters the required details and uploads a file. I have two buttons named Upload for Uploading File and Create for creating new profile.</p>
  
  <p><strong>My Problem</strong></p>
  
  <p>My problem is I don't want to reload the whole page when user clicks on upload button. I was thinking of using an webmethod for fileupload. </p>
  
  <p>I  don't know if what am I doing wrong here</p>
  
  <p>Can any one correct me</p>
  
  <p>This is my Webmethod in my controller named Create</p>
  
  <p><strong>Controller</strong></p>
  
  <pre><code>   [WebMethod]
     public string  FileUpload(HttpPostedFileBase file, BugModel model)
     {             
         BugModel bug = null;
         if (file != null &amp;&amp; file.ContentLength &gt; 0)
         {
             string path = "/Content/UploadedFiles/" + Path.GetFileName(file.FileName);
             string savedFileName = Path.Combine(System.Web.HttpContext.Current.Server.MapPath ("~" +path));
             file.SaveAs(savedFileName);
             BugAttachment attachment = new BugAttachment();
             attachment.FileName = "~" + path.ToString();
             bug.ListFile.Add(attachment);
             model = bug;              
         }
         return "FileUploaded";          
     }
  </code></pre>
  
  <p>used a script to call the method </p>
  
  <p><strong>Javascript</strong></p>
  
  <pre><code>       &lt;script type="text/javascript"&gt;
        function UploadFile() {       
          $.ajax({
              type:"Post",
              url: "LogABug/FileUpload",
              data: "{}",
              contentType: "application/json; charset=utf-8",
              dataType: "json",
              success: function (msg) {
                  alert("File Uploaded")
              },
              error: function () {
                  ErrorMessage("Try Again");
              }
          });
      }
   &lt;/script&gt;
  </code></pre>
  
  <p>can any one tell me how can I do this ...if this is the wrong method correct me the right one with the ideas please</p>