I got an .aspx file in which I want to have a file uploader that I got from here. There are examples included how to get this to work. When I test it only do the HTML and javascript I can get it to work, but when I try to get it working with C# I can’t get the path to the .js file right.
The example html/javascript file is:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link href="fileuploader.css" rel="stylesheet" type="text/css">
<style>
body {font-size:13px; font-family:arial, sans-serif; width:700px; margin:100px auto;}
</style>
</head>
<script src="fileuploader.js" type="text/javascript"></script>
<script>
function createUploader(){
var uploader = new qq.FileUploader({
element: document.getElementById('file-uploader-demo1'),
action: 'do-nothing.htm',
debug: true
});
}
// in your app create uploader as soon as the DOM is ready
// don't wait for the window to load
window.onload = createUploader;
</script>
</body>
</html>
And I want to get it in the following .aspx file. The .js and .css file are in the D:\svn\Web\Framework\Trunk\test.Web.Framework\Scripts\fileuploader location and the .aspx file is in D:\svn\Web\Healthcare\trunk\test.Web.Healthcare\Areas\Framework\Administration\Entity. I tried to do the following, but this gives me a GET =1325724928825″>http://localhost:1304/Administration/blue/en-gb/Entity/Index/~/Scripts/fileuploader/fileuploader.js?=1325724928825 404 (Not Found) error:
<%@ Control Language="C#" Inherits="test.Web.Framework.Core.ViewUserControl<test.Web.Framework.Areas.Administration.Models.NoteModel>" %>
<% using (UI.koform(Model, null))
{ %>
<div class="ui-state-highlight ui-corner-all highlight" data-bind="visible: meta.message">
<span class="ui-icon ui-icon-info"></span><strong data-bind="text: meta.message">
</strong>
</div>
Subject:
<input type="text" data-bind="value:subject" />
<span data-bind="text: subject"></span>
<br />
Text:
<input type="text" data-bind="value:text" />
<br />
<!--
<a href="#" data-bind="click:function(){setvalues() }">set values</a>
-->
<div class="dialogButtons">
<button onclick="$('#<%:Model.meta.modelname%>').koform('submit');">
Save</button>
</div>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link href="~/Scripts/fileuploader/fileuploader.css" rel="stylesheet" type="text/css">
</head>
<div id="file-uploader-demo1">
<noscript>
<p>Please enable JavaScript to use file uploader.</p>
<!-- or put a simple form for upload here -->
</noscript>
</div>
"~/Scripts/fileuploader/fileuploader.css"
<script src="~/Scripts/fileuploader/fileuploader.js" type="text/javascript"></script>
<script>
function createUploader() {
var uploader = new qq.FileUploader({
element: document.getElementById('file-uploader-demo1'),
action: 'do-nothing.htm',
debug: true
});
}
// in your app create uploader as soon as the DOM is ready
// don't wait for the window to load
window.onload = createUploader;
</script>
<%}%>
Easy fix. Replace your hrefs with something like this…
This will resolve the URL relative to your web application’s root folder. Do the same for your stylesheets and other references.
I use this all over the place but particularly in Master Pages.