title: AJAX image upload MVC4 ASP.Net not working
body: <p>Below I have the relevant code parts for my AJAX image upload for my MVC4 ASP.Net application. However when I click on the upload  link it simply appends an # to the end of my URL link so <code>http://localhost:10991/StoreManager/Create#</code> and goes to the top of the page. </p>
  
  <p>There are no errors I can see appearing in the Debugger or console window. </p>
  
  <p>I have used the code from here</p>
  
  <pre><code>http://powerdotnetcore.com/asp-net-mvc/asp-net-mvc-simple-ajax-file-upload-using-jquery
  </code></pre>
  
  <p>_PartialView</p>
  
  <pre><code>   @model SwitchClothing.Models.Image
  
     &lt;script src="~/Scripts/jquery-2.1.0.min.js"&gt;&lt;/script&gt;
     &lt;script src="~/Scripts/jquery-ui-1.10.4.js"&gt;&lt;/script&gt;
     &lt;script src="~/Scripts/jquery.validate.min.js"&gt;&lt;/script&gt;
     &lt;script src="~/Scripts/jquery.validate.unobtrusive.min.js"&gt;&lt;/script&gt;
     &lt;script src="~/Scripts/FileUpload/jquery.fileupload.js"&gt;&lt;/script&gt;
     &lt;script src="~/Scripts/FileUpload/jquery.fileupload-ui.js"&gt;&lt;/script&gt;
     &lt;script src="~/Scripts/FileUpload/jquery.iframe-transport.js"&gt;&lt;/script&gt;
     &lt;script src="~/Scripts/upload.js"&gt;&lt;/script&gt;
  
  
     &lt;div class="well"&gt;
         &lt;div&gt;
             &lt;h1&gt;Upload by click&lt;/h1&gt;
         &lt;/div&gt;
         &lt;div&gt;@Html.TextBoxFor(m =&gt; m.MyFile, new { id = "fu-my-simple-upload", type = "file" }) &amp;nbsp;&lt;a href="#" id="hl-start-upload"&gt;Start upload&lt;/a&gt; &lt;/div&gt;
     &lt;/div&gt;
  </code></pre>
  
  <p>Upload.js</p>
  
  <pre><code>    var jqXHRData;
  
  $(document).ready(function () {
  
      initSimpleFileUpload();
  
      $("#hl-start-upload").on('click', function () {
          if (jqXHRData) {
              jqXHRData.submit();
          }
          return false;
      });
  
  });
  
  function initSimpleFileUpload() {
      'use strict';
  
      $('#fu-my-simple-upload').fileupload({
          url: '/File/UploadFile',
          dataType: 'json',
          add: function (e, data) {
              jqXHRData = data
          },
          done: function (event, data) {
              if (data.result.isUploaded) {
  
              }
              else {
  
              }
              alert(data.result.message);
          },
          fail: function (event, data) {
              if (data.files[0].error) {
                  alert(data.files[0].error);
              }
          }
      });
  }
  </code></pre>
  
  <p>Controller Action</p>
  
  <pre><code>[HttpPost]
          public virtual ActionResult UploadFile()
          {
              HttpPostedFileBase myFile = Request.Files["MyFile"];
              bool isUploaded = false;
              string message = "File upload failed";
  
              if (myFile != null &amp;&amp; myFile.ContentLength != 0)
              {
                  string pathForSaving = Server.MapPath("~/Images");
                  if (this.CreateFolderIfNeeded(pathForSaving))
                  {
                      try
                      {
                          myFile.SaveAs(Path.Combine(pathForSaving, myFile.FileName));
                          isUploaded = true;
                          message = "File uploaded successfully!";
                      }
                      catch (Exception ex)
                      {
                          message = string.Format("File upload failed: {0}", ex.Message);
                      }
                  }
              }
              return Json(new { isUploaded = isUploaded, message = message }, "text/html");
          }
  
          private bool CreateFolderIfNeeded(string path)
          {
              bool result = true;
              if (!Directory.Exists(path))
              {
                  try
                  {
                      Directory.CreateDirectory(path);
                  }
                  catch (Exception)
                  {
                      /*TODO: You must process this exception.*/
                      result = false;
                  }
              }
              return result;
          }
  </code></pre>
  
  <p>Rendering the partial view in the Create page of model view</p>
  
  <pre><code>@RenderPage("_Upload.cshtml")
  </code></pre>