title: Jquery.FileUpload with MVC 5 not working
body: <p>Using <code>MVC 5 , VS 2013 , jquery 2.13</code></p>
  
  <p>I am following <a href="https://github.com/maxpavlov/jQuery-File-Upload.MVC3" rel="nofollow noreferrer">Max Pavlov</a> tutorial on github.</p>
  
  <p>I have added all css and js files in my <strong>bundleconfig.cs</strong>. And they are rendered page. But in addition, as I am using tinyMCE, and other various jquery plugins, and they are also decalred in bundleconfig.cs, they also loaded in this page.</p>
  
  <p>However, none of the <strong>functionalities</strong> of <strong>FileUploader</strong> is taking effect. All css's are applied and rendering correctly. </p>
  
  <p>But <strong>No javascript</strong>. Files are adding first time, but after calling handler, as it's returnig <code>json</code> data, the data is direcly shown in the browser as <code>text/plain</code>. </p>
  
  <p>In console its showing following messages : </p>
  
  <p><img src="https://i.stack.imgur.com/MY1dV.png" alt="enter image description here"></p>
  
  <p>In this case what should I do?</p>
  
  <p><strong>My View Page :</strong> </p>
  
  <pre><code>@using ClientDependency.Core.Mvc
  
  @{
  @Scripts.Render("~/bundles/UploadJS")
  }
  &lt;script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js?cdv=1"&gt;&lt;/script&gt; 
  &lt;script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/jquery-ui.min.js?cdv=1"&gt;&lt;/script&gt; 
          &lt;div class=" row-6"&gt;
      &lt;div class="container"&gt;
          &lt;form id="fileupload" action="~/Upload/UploadHandler.ashx" method="POST" enctype="multipart/form-data"&gt;
              &lt;!-- The fileupload-buttonbar contains buttons to add/delete files and start/cancel the upload --&gt;
              &lt;div class="row fileupload-buttonbar"&gt;
                  &lt;div class="span7"&gt;
                      &lt;!-- The fileinput-button span is used to style the file input field as button --&gt;
                      &lt;span class="btn btn-success fileinput-button"&gt;
                          &lt;i class="icon-plus icon-white"&gt;&lt;/i&gt;
                          &lt;span&gt;Add files...&lt;/span&gt;
                          &lt;input type="file" name="files[]" multiple onclick="alert('click');"&gt;
                      &lt;/span&gt;
                      &lt;button type="submit" class="btn btn-primary start"&gt;
                          &lt;i class="icon-upload icon-white"&gt;&lt;/i&gt;
                          &lt;span&gt;Start upload&lt;/span&gt;
                      &lt;/button&gt;
                      &lt;button type="reset" class="btn btn-warning cancel"&gt;
                          &lt;i class="icon-ban-circle icon-white"&gt;&lt;/i&gt;
                          &lt;span&gt;Cancel upload&lt;/span&gt;
                      &lt;/button&gt;
                      &lt;button type="button" class="btn btn-danger delete"&gt;
                          &lt;i class="icon-trash icon-white"&gt;&lt;/i&gt;
                          &lt;span&gt;Delete&lt;/span&gt;
                      &lt;/button&gt;
                      &lt;input type="checkbox" class="toggle"&gt;
                  &lt;/div&gt;
                  &lt;div class="span5"&gt;
                      &lt;!-- The global progress bar --&gt;
                      &lt;div class="progress progress-success progress-striped active fade"&gt;
                          &lt;div class="bar" style="width:0%;"&gt;&lt;/div&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
              &lt;!-- The loading indicator is shown during image processing --&gt;
              &lt;div class="fileupload-loading"&gt;&lt;/div&gt;
              &lt;br&gt;
              &lt;!-- The table listing the files available for upload/download --&gt;
              &lt;table class="table table-striped"&gt;
                  &lt;tbody class="files" data-toggle="modal-gallery" data-target="#modal-gallery"&gt;
                  &lt;/tbody&gt;
              &lt;/table&gt;
          &lt;/form&gt;
  
          &lt;!-- modal-gallery is the modal dialog used for the image gallery --&gt;
          &lt;div id="modal-gallery" class="modal modal-gallery hide fade"&gt;
              &lt;div class="modal-header"&gt;
                  &lt;a class="close" data-dismiss="modal"&gt;&amp;times;&lt;/a&gt;
                  &lt;h3 class="modal-title"&gt;&lt;/h3&gt;
              &lt;/div&gt;
              &lt;div class="modal-body"&gt;&lt;div class="modal-image"&gt;&lt;/div&gt;&lt;/div&gt;
              &lt;div class="modal-footer"&gt;
                  &lt;a class="btn btn-primary modal-next"&gt;
                      &lt;span&gt;Next&lt;/span&gt;
                      &lt;i class="icon-arrow-right icon-white"&gt;&lt;/i&gt;
                  &lt;/a&gt;
                  &lt;a class="btn btn-info modal-prev"&gt;
                      &lt;i class="icon-arrow-left icon-white"&gt;&lt;/i&gt;
                      &lt;span&gt;Previous&lt;/span&gt;
                  &lt;/a&gt;
                  &lt;a class="btn btn-success modal-play modal-slideshow" data-slideshow="5000"&gt;
                      &lt;i class="icon-play icon-white"&gt;&lt;/i&gt;
                      &lt;span&gt;Slideshow&lt;/span&gt;
                  &lt;/a&gt;
                  &lt;a class="btn modal-download" target="_blank"&gt;
                      &lt;i class="icon-download"&gt;&lt;/i&gt;
                      &lt;span&gt;Download&lt;/span&gt;
                  &lt;/a&gt;
              &lt;/div&gt;
          &lt;/div&gt;
          &lt;!-- The template to display files available for upload --&gt;
          &lt;script id="template-upload" type="text/x-tmpl"&gt;
              {% for (var i=0, file; file=o.files[i]; i++) { %}
              &lt;tr class="template-upload fade"&gt;
                  &lt;td class="preview"&gt;&lt;span class="fade"&gt;&lt;/span&gt;&lt;/td&gt;
                  &lt;td class="name"&gt;&lt;span&gt;{%=file.name%}&lt;/span&gt;&lt;/td&gt;
                  &lt;td class="size"&gt;&lt;span&gt;{%=o.formatFileSize(file.size)%}&lt;/span&gt;&lt;/td&gt;
                  {% if (file.error) { %}
                  &lt;td class="error" colspan="2"&gt;&lt;span class="label label-important"&gt;{%=locale.fileupload.error%}&lt;/span&gt; {%=locale.fileupload.errors[file.error] || file.error%}&lt;/td&gt;
                  {% } else if (o.files.valid &amp;&amp; !i) { %}
                  &lt;td&gt;
                      &lt;div class="progress progress-success progress-striped active"&gt;&lt;div class="bar" style="width:0%;"&gt;&lt;/div&gt;&lt;/div&gt;
                  &lt;/td&gt;
                  &lt;td class="start"&gt;
                      {% if (!o.options.autoUpload) { %}
                      &lt;button class="btn btn-primary"&gt;
                          &lt;i class="icon-upload icon-white"&gt;&lt;/i&gt;
                          &lt;span&gt;{%=locale.fileupload.start%}&lt;/span&gt;
                      &lt;/button&gt;
                      {% } %}
                  &lt;/td&gt;
                  {% } else { %}
                  &lt;td colspan="2"&gt;&lt;/td&gt;
                  {% } %}
                  &lt;td class="cancel"&gt;
                      {% if (!i) { %}
                      &lt;button class="btn btn-warning"&gt;
                          &lt;i class="icon-ban-circle icon-white"&gt;&lt;/i&gt;
                          &lt;span&gt;{%=locale.fileupload.cancel%}&lt;/span&gt;
                      &lt;/button&gt;
                      {% } %}
                  &lt;/td&gt;
              &lt;/tr&gt;
              {% } %}
  &lt;/script&gt;
      &lt;!-- The template to display files available for download --&gt;
      &lt;script id="template-download" type="text/x-tmpl"&gt;
          {% for (var i=0, file; file=o.files[i]; i++) { %}
          &lt;tr class="template-download fade"&gt;
              {% if (file.error) { %}
              &lt;td&gt;&lt;/td&gt;
              &lt;td class="name"&gt;&lt;span&gt;{%=file.name%}&lt;/span&gt;&lt;/td&gt;
              &lt;td class="size"&gt;&lt;span&gt;{%=o.formatFileSize(file.size)%}&lt;/span&gt;&lt;/td&gt;
              &lt;td class="error" colspan="2"&gt;&lt;span class="label label-important"&gt;{%=locale.fileupload.error%}&lt;/span&gt; {%=locale.fileupload.errors[file.error] || file.error%}&lt;/td&gt;
              {% } else { %}
              &lt;td class="preview"&gt;
                  {% if (file.thumbnail_url) { %}
                  &lt;a href="{%=file.url%}" title="{%=file.name%}" rel="gallery" download="{%=file.name%}"&gt;&lt;img src="{%=file.thumbnail_url%}"&gt;&lt;/a&gt;
                  {% } %}
              &lt;/td&gt;
              &lt;td class="name"&gt;
                  &lt;a href="{%=file.url%}" title="{%=file.name%}" rel="{%=file.thumbnail_url&amp;&amp;'gallery'%}" download="{%=file.name%}"&gt;{%=file.name%}&lt;/a&gt;
              &lt;/td&gt;
              &lt;td class="size"&gt;&lt;span&gt;{%=o.formatFileSize(file.size)%}&lt;/span&gt;&lt;/td&gt;
              &lt;td colspan="2"&gt;&lt;/td&gt;
              {% } %}
              &lt;td class="delete"&gt;
                  &lt;button class="btn btn-danger" data-type="{%=file.delete_type%}" data-url="{%=file.delete_url%}"&gt;
                      &lt;i class="icon-trash icon-white"&gt;&lt;/i&gt;
                      &lt;span&gt;{%=locale.fileupload.destroy%}&lt;/span&gt;
                  &lt;/button&gt;
                  &lt;input type="checkbox" name="delete" value="1"&gt;
              &lt;/td&gt;
          &lt;/tr&gt;
          {% } %}
      &lt;/script&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p></p>
  
  <p><strong>controller Page</strong> is OK I think. So its not shown here.</p>
  
  <p><strong>My BundleConfig.cs is like:</strong> Only RegisterBundle() method is here.</p>
  
  <pre><code>        public static void RegisterBundles(BundleCollection bundles)
      {
          //bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
          //            "~/Scripts/jquery-{version}.js"));
  
          bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include(
                      "~/Scripts/jquery.validate*"));
  
          // Use the development version of Modernizr to develop with and learn from. Then, when you're
          // ready for production, use the build tool at http://modernizr.com to pick only the tests you need.
          //bundles.Add(new ScriptBundle("~/bundles/modernizr").Include(
          //            "~/Scripts/modernizr-*"));
  
          //bundles.Add(new ScriptBundle("~/bundles/bootstrap").Include(
          //          "~/Scripts/bootstrap.js",
          //          "~/Scripts/respond.js"));
  
          //bundles.Add(new StyleBundle("~/Content/css").Include(
          //          "~/Content/bootstrap.css",
          //          "~/Content/site.css"));
  
  
          //External Fancy Theme implemented by Tofael............................................
  
          bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
                    "~/Theme/js/jquery.js",
                    "~/Theme/js/jquery.easing.1.3.js",
                    "~/Theme/js/modernizr.custom.js"));
  
          bundles.Add(new ScriptBundle("~/bundles/jqueryNavigation").Include(
                    "~/Theme/js/jquery.responsivemenu.js",
                    "~/Theme/js/superfish.js",
                    "~/Theme/js/nav-small.js",
                    "~/Theme/js/mobile.menu.js"));
  
          bundles.Add(new ScriptBundle("~/bundles/jqueryRevolutionSlider").Include(
                    "~/Theme/js/jquery.themepunch.plugins.min.js",
                    "~/Theme/js/jquery.themepunch.revolution.min.js"));
  
          bundles.Add(new ScriptBundle("~/bundles/jquerySlider").Include(
                    "~/Theme/js/jquery.flexslider.text.js",
                    "~/Theme/js/jquery.flex-owl-slider-min.js",
                    "~/Theme/js/jquery.elastislide.js"));
  
          bundles.Add(new ScriptBundle("~/bundles/jqueryEasyPieChart").Include(
                    "~/Theme/js/jquery.easypiechart.js"));
  
          bundles.Add(new ScriptBundle("~/bundles/jqueryImagehover").Include(
                    "~/Theme/js/jquery-hover-effect.js"));
  
          bundles.Add(new ScriptBundle("~/bundles/jqueryColorbox").Include(
                    "~/Theme/js/jquery.colorbox-min.js"));
  
          bundles.Add(new ScriptBundle("~/bundles/jqueryTooltip").Include(
                    "~/Theme/js/tooltip.js",
                    "~/Theme/js/jquery.tipsy.js",
                    "~/Theme/js/jquery.ui.totop.js",
                    "~/Theme/js/jquery.isotope.min.js",
                    "~/Theme/js/popover.js",
                    "~/Theme/js/imagebox.min.js"));
  
          bundles.Add(new ScriptBundle("~/bundles/jqueryRevolutionSliderOwl").Include(
                    "~/Theme/js/owl.carousel.js"));
  
          bundles.Add(new ScriptBundle("~/bundles/jqueryScript").Include(
                    "~/Theme/js/script.js",
                    "~/Theme/js/custom.js"));
  
          bundles.Add(new StyleBundle("~/Content/cssfont").Include(
                    "~/Theme/css/font-awesome.css",
                    "~/Theme/css/style.css",
                    "~/Theme/css/carousel.css",
                    "~/Theme/css/colorbox.css",
                    "~/Theme/css/elements.css",
                    "~/Theme/css/rv.css",
                    "~/Theme/css/fdw-demo.css",
                    "~/Theme/css/flex-owl-slider.css",
                    "~/Theme/css/forms.css",
                    "~/Theme/css/rv.css",
                    "~/Theme/css/ie.css",
                    "~/Theme/css/imagebox.css",
                    "~/Theme/css/skeleton.css",
                    "~/Theme/css/superfish.css",
                    "~/Content/Bootstrap/bootstrap.min.css",
                    "~/Content/Bootstrap/bootstrap-responsive.min.css",
                    "~/Content/Bootstrap/bootstrap-image-gallery.min.css",
                    "~/Content/FileUpload/jquery.fileupload-ui.css"
                    ));
  
          bundles.Add(new StyleBundle("~/Content/cssGridMvc").Include(
                    "~/Content/Gridmvc.css",
                    "~/Content/gridmvc.datepicker.css",
                    "~/Content/gridmvc.datepicker.min.css"));
  
          bundles.Add(new ScriptBundle("~/bundles/jqueryGridMvc").Include(
                    "~/Scripts/gridmvc.min.js",
                    "~/Scripts/bootstrap-datepicker.js"));
  
          bundles.Add(new ScriptBundle("~/bundles/UploadJS").Include(
                    "~/Scripts/jquery-ui-1.8.11.min.js",
                    "~/Scripts/jquery-2.1.3.min.js",
                    "~/Content/FileUpload/tmpl.min.js",
                    "~/Content/FileUpload/canvas-to-blob.min.js",
                    "~/Content/FileUpload/load-image.min.js",
                    "~/Content/Bootstrap/bootstrap-image-gallery.min.js",
                    "~/Content/Bootstrap/bootstrap.min.js",
                    "~/Content/FileUpload/jquery.iframe-transport.js",
                    "~/Content/FileUpload/jquery.fileupload.js",
                    "~/Content/FileUpload/jquery.fileupload-ip.js",
                    "~/Content/FileUpload/jquery.fileupload-ui.js",
                    "~/Content/FileUpload/locale.js",
                    "~/Content/FileUpload/main.js"));
  
          bundles.Add(new ScriptBundle("~/bundles/jqueryTinymce").Include(
                    "~/Scripts/tinymce/tiny_mce.js",
                    "~/Scripts/tinymce/jquery.tinymce.js"));
  
          BundleTable.EnableOptimizations = false;
      }
  </code></pre>