Including js/css file in control or extension method to html helper class in asp.net mvc 3

Question

I am developing a grid control, in which i want use some javascipt. I added a js file into the class library project and set its Buid Action to "Embded Resource". But the js/jquery functions (Implemented in js file) are not accessing, also i am not able to view the included js file in other project where i am using that dll, everything is working fine expect this one.

Please provide some help.

Prashanth Thurairatnam · Accepted Answer · 2012-09-23T15:52:52.157

5

Have an Action method in your Controller. Using reflection you can read the resourceName and return it as FileStreamResult. In the view add script path as /Controller/Action/actualjsfile.js

Refer to this Blog Post as well

Steps on tested sample as follows

Create class library project (JSDLL)

add TestJS.js as embedded resource (file contents as shown below)

function MyAlert() {
    alert("Hello! this is from the dll");
}

In AssemblyInfo.cs add the following (need to add reference to System.Web.dll)

[assembly: System.Web.UI.WebResource("JSDLL.TestJS.js", "application/x-javascript")]

Compile class library project and add as reference to your MVC project

In your controller add the following action (same as the blog post; but with minor modifications)

    public FileStreamResult ContentFile(string id)
    {
        string resourceName = Assembly.GetAssembly(typeof(JSDLL.Class1)).GetManifestResourceNames().ToList().FirstOrDefault(f => f.EndsWith(id));
        return new FileStreamResult(Assembly.GetAssembly(typeof(JSDLL.Class1)).GetManifestResourceStream(resourceName), "text/javascript");
    }

Simple View to test (have a look at how the .js file is referenced. onClick I am calling the function from the .js file)

@{
    ViewBag.Title = "About Us";
}

<h2>About</h2>
<p>
     Put content here.     
     <button type="button" onclick="MyAlert()">Text</button>
</p>

<script type="text/javascript" src="/Home/ContentFile/TestJS.js"/>

output

enter image description here

EDITED (for Matthew's comment)

here are few screen shots

enter image description here

edited Sep 23 '12 at 15:52

answered Jun 07 '12 at 13:52

Prashanth Thurairatnam

4,353
2
14
17

Is there a way to get this to work with subfolders? I'm trying to have themes embedded in my dll. – Matthew Grima Sep 20 '12 at 12:51
@MatthewGrima I guess you want your js file to be under a folder in the class library project (dll). Nothing needs to be changed; it should work with the same implementation as in the answer I've provided. Did you try it? it should work (I've tried this & it works fine) – Prashanth Thurairatnam Sep 23 '12 at 14:08
I wouldn't be able to resolve /Home/ContentFile/js/test.js I'm trying to achieve that but I think I need to hack around MapRoutes to get there(if possible) – Matthew Grima Sep 23 '12 at 14:48
@MatthewGrima I've edited my answer with few screen shots. Hope this is what you are after. – Prashanth Thurairatnam Sep 23 '12 at 15:54
+1 for your help, although that isn't what I'm asking (probably because I'm being a bit vague). You you are requesting the js file like so: . Even though it's inside /js/TestJS.js. I'm trying to find a way to request it like this As I said, I do not think it's possible, but one can hope :) – Matthew Grima Sep 24 '12 at 07:33
1

@MatthewGrima I am not sure why you need this. With the default route map in MVC it takes the format Controller/Action/id. You can define your own custom route map and achieve what you want. There are plenty of articles on this. Google for the help. here is one http://weblogs.asp.net/scottgu/archive/2007/12/03/asp-net-mvc-framework-part-2-url-routing.aspx – Prashanth Thurairatnam Sep 24 '12 at 12:56

Asif Mushtaq · Answer 2 · 2012-06-07T11:44:47.450

0

"Embded Resource" makes your js file part of the dll therefore you can not view it in other projects.

js file is suppose to be access from your javascript code and you don't need to embed it in a dll.

edited Jun 07 '12 at 11:44

answered Jun 07 '12 at 11:38

Asif Mushtaq

13,010
3
33
42

Thanks, i will do the same (take a look of this. http://msdn.microsoft.com/en-us/library/bb398930.aspx) but what next ? – Abhishek Jun 07 '12 at 11:40
Change the property from "Embeded resource" to "none" and carry the file along with your dll. – Asif Mushtaq Jun 07 '12 at 11:42
You mean, will manually add that js file in each view where ever anyone use that extension method ? if Yes then i would like to mention i want to add it dynamically at run time. – Abhishek Jun 07 '12 at 11:46

score 0 · Answer 3 · edited May 23 '17 at 10:09

If you want to embed CSS/JS in the DLL, you'll need to reference them differently than just using the file name. Check out http://www.karpach.com/Custom-ASP-NET-server-control-with-embedded-resources.htm for information about it (it's for ASP.NET 2.0, but it should give you some idea to start with).

Also, check out this [stackoverflow question] on whether or not you should embed those resources.

[1] Should I embed CSS/JavaScript files in a web application?

Including js/css file in control or extension method to html helper class in asp.net mvc 3

3 Answers3