I recently completed a tutorial on ASP.NET MVC file uploads using Valums plugin and made sure to place all the necessary js, css, and gif files in their respective folders. However, I am facing an issue where the view is not displaying anything.
<link href="@Url.Content("~/css/fileuploader.css")" rel="stylesheet" type="text/css" />
<script src="@Url.Content("~/js/fileuploader.js")" type="text/javascript"></script>
<div id="file-uploader">
<noscript>
<p>
Please enable JavaScript to use file uploader.</p>
</noscript>
</div>
<script type="text/javascript">
var uploader = new qq.FileUploader({
element: document.getElementById('file-uploader'),
action: '@Url.Action("upload")' // specify path for handling upload
//,allowedExtensions: ['jpg', 'jpeg', 'png', 'gif'] // uncomment if only images are allowed
sizeLimit: 4000000, // maximum size limit of 4MB
minSizeLimit: 0 // minimum size required
});
</script>
I am encountering an error with this script. When inspecting with Firebug, the error message indicates:
missing } after property list
Upon reviewing the page source:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Home Page</title>
<link href="/Content/Site.css" rel="stylesheet" type="text/css" />
<script src="/Scripts/jquery-1.5.1.min.js" type="text/javascript"></script>
<script src="/Scripts/modernizr-1.7.min.js" type="text/javascript"></script>
</head>
<body>
<div class="page">
<header>
<div id="title">
<h1>My MVC Application</h1>
</div>
<div id="logindisplay">
[ <a href="/Account/LogOn">Log On</a> ]
</div>
<nav>
<ul id="menu">
<li><a href="/">Home</a></li>
<li><a href="/Home/About">About</a></li>
</ul>
</nav>
</header>
<section id="main">
<link href="/css/fileuploader.css" rel="stylesheet" type="text/css" />
<script src="/js/fileuploader.js" type="text/javascript"></script>
<div id="file-uploader">
<noscript>
<p>
Please enable JavaScript to use file uploader.</p>
</noscript>
</div>
<script type="text/javascript">
var uploader = new qq.FileUploader({
element: document.getElementById('file-uploader'),
action: '/Home/upload' // provide path for uploading functionality
//,allowedExtensions: ['jpg', 'jpeg', 'png', 'gif'] // specify if limited to image uploads only
sizeLimit: 4000000, // max file size set to approximately 4MB
minSizeLimit: 0 // lowest acceptable file size
});
</script>
</section>
<footer>
</footer>
</div>
</body>
</html>