I have a ViewUserControl that will be used in some pages in my site, but not all.
This ViewUserControl requires a javascript file, so I would like to have the script reference added automatically to the head session of the pages that are using this ViewUserControl, is that possible?
I tried to add a content control to it, but looks like it is not allowed.
I could also add the script tag straight into the ViewUserControl's .ascx code, but then I will have the script reference added N times if I have N of such controls in a page.
Does anyone have any ideas?
In the code-behind of the ASCX, register your script reference (or block). I just answered a similar question explaining how to do this:
How to best control loading of multiple javascript files in ASP.NET?
With this technique, you can have the same control on the page multiple times, yet still include the script only once (and only on pages that actually include the control).
Related
I've inherited an MVC3 project that has a large number of ASPX views that I would like to convert to Razor. This question => Aspx to Razor syntax converter? is similar to mine, and it helped me find a bunch of options for converting the views themselves, but I'm unclear on the steps I need to take in addition to converting the views.
The first known limitation of Telerik's razor-converter is "The tool only works with views and does not deal with the project structure and master pages". This tool claims to be able to convert master pages as well, but it doesn't look like anybody beyond the developer has ever used it.
I think these are the steps I need to take:
Use a utility to convert the views
Convert the master pages manually (how do I do this?)
Modify the project structure (what needs to be modified?)
Delete the ASPX files
Test the application (any specific gotchas I should look out for?)
Are these the right steps? Can you help me with my questions on steps 2 and 3?
I have only tried this on one solution and the actual conversion did a fairly good job. I downloaded the Telerik converter project, compiled it, and then converted my projects using these command lines:
aspx2razor C:\Development\MyProject\MyWebProject\*.ascx C:\Development\MyProject\MyWebProject -r
aspx2razor C:\Development\MyProject\MyWebProject\*.aspx C:\Development\MyProject\MyWebProject -r
aspx2razor C:\Development\MyProject\MyWebProject\*.master C:\Development\MyProject\MyWebProject -r
I only needed to go back to add an #include for a namespace here and there, and to add a few parenthesis to force the Razor view engine to recognize my inline code properly. This was also a fairly simple solution, so YMMV. But even if it converted 80-90% of your views successfully, it's that much less manual work which you would have to perform yourself. From here, you could also create a _ViewStart.cshtml file and make a few minor adjustments to take advantage of Razor-specific layout features. (Check out Scott Gu's post on it here: http://weblogs.asp.net/scottgu/archive/2010/10/22/asp-net-mvc-3-layouts.aspx)
The big issue I had was trying to reconcile the file changes with source control. Since the classic MVC view engine uses .aspx, .ascx, and .master extensions, I had to manually add the .cshtml files to my MVC web project and source control then remove the old versions. It wasn't difficult, just time-consuming.
In addition, you may need to add all of the necessary web.config entries to support the Razor view engine as well if your project was created using MVC 1 or 2. Projects created with MVC 3 should already have these entries in place, even if it was not originally created as a Razor site.
I am getting ready to code a number of HTML helpers for UI elements in an ASP.NET MVC 3 project. I expect many of the helpers to depend on code that is located in external javascript libraries. These could be custom javascript libraries that I write, or they could reference 3rd party libraries like jQuery and jQueryUI. For example, I might write HTML.RichM.DataPicker(...) that would require the page to have jQuery and jQueryUI referenced and some code executed in the document ready function. Getting code into the document ready function is pretty straightforward I guess -- I could simply inject a new script block into the output with the contents of the function, even though that would mean I might have a page peppered with document ready functions all over.
The other part of this is making sure that the jQuery and jQuery UI libraries (in my example) are referenced and included. Is there an "MVC way" to add the code references to the view page or the layout/master if they are not already there, or must I instruct users of my HTML helpers that they need to add references manually for any required javascript files? Of course, I could just instruct them to include all possible external library references in the master or layout page, but that seems like overkill. In ASP.NET Web Forms, for example, I might have used RegisterClientStartupScript or RegisterStartupScript to do this from my custom control.
Thanks for any suggestions!
I think the easiest way is to include the dependant scripts in the header, that's maybe not what you want to do, but I think it's the easiest way.
I suggest you using a tool like SquishIt to bundle your JS files together, that way, you will not have to load like 20 js files, it will be more efficient and cleaner.
Ok so this is a little random but..
Using MVC 3 (with Razor view engine) with Knockout.js which uses jQuery Templating i've come across a little problem i'm sure is possible to solve.
In order to use jQuery-Tmpl you need to supply a template in
<script type="text/html">
...template elements go here...
</script>
Now the problem is that the razor view engine doesn't seem to generate HTML inside of these specific script tags. It handles standard html, (script type="text/javascript") fine but appears to just not do anything with the aforementioned script tag.
Does anyone know how to get around this issue i.e. how to use MVC 3 Razor with jQuery-Tmpl?
There is a pretty good solution in this blog post: http://www.wiredprairie.us/blog/index.php/archives/1204
This creates a "template" helper that emits the script start/end tags.
Otherwise, I have some ideas for putting templates in external files, which would be another way to avoid this issue. It involves storing the templates in .html files and injecting them into the page into script tags. There are certainly many ways that this could be accomplished though on the client or server side, just a few ideas.
A more general approach if you want to keep things in the document is using #Html.Raw to output html without affecting the edit-time syntax state.
For example:
#Html.Raw("<script type='text/x-dot-template' id='awesome_template'>")
<!-- insert some awesomeness here -->
#Html.Raw("</script>")
I happen to like the helper method suggested above a little better, but it has not always been something I was able to implement, so this is an alternative with its own benefits (namely clarity over ease of use and terseness)
Good day!
I'm looking for solution to combine, minimize and gzip CSS and JavaScript files. It seems they come in two forms:
In form of ASP.NET handler\module with processing files on the fly (with caching results)
In form of VS build tasks (to perform processing while building)
Generally I'm ok with either.
I've looked on a number of solutions (and I use ASP.NET handler from this article http://www.codeproject.com/KB/aspnet/httpcompression.aspx a lot), but maybe something "must have" came out and I've missed it.
Thanks in advance!
Here's my advice to you: use build tasks and HTTP cache the output.
In terms of build tasks, you'll want to check out your favorite JavaScript minifier (my favorite is Google Closure Minifier) that has a command line utility that you can just plug into your project file, MSBUILD file or NANT file. Same deal with CSS (I personally use Yahoo! YUI Compressor). If you're into using LESS, you can certainly combine this with the YUI compressor. To optimize images, I'd use optipng. There's directions on how these guys work on their individual sites.
Now, after you have these files all nice and optimized, you'll want to output them using a handler or controller action for MVC. To set the expiration so that subsequent requests will default to the file downloaded on the first request, you'll want this to run in your code:
Response.ExpiresAbsolute = DateTime.Now.AddYears(1);
More than likely you'll want a cache-buster strategy so that you can change the content files. You'd do this by passing a random parameter to your handler. There are a few different ways to go about this... just Google it.
Hope this helps.
I'm using the telerik mvc components for small-medium sites. It was simple to add and configure with NuGet.
Moth can (among other things) handle all your javascript / css requests on the fly. See Wiki: Javascript.
Best of all, it can also put all javascript at the bottom of the page, including parts you write in your partial views! Wiki: Inline script.
I have just started playing with the ASP.Net MVC framework, and today I created a simple UserControl that uses some CSS. Since the CSS was declared in a separate file and included in the View that called the UserControl, and not in the UserControl itself, Visual Studio could not find any of the CSS classes used in the UserControl. This got me thinking about what would be the most appropriate way of dealing with CSS in UserControls.
Declaring the CSS in the View that is using the UserControl gives more flexibility if the same control is used in different contexts and needs to be able to adapt to the style of the calling View.
Having the UserControl supply its own CSS would lead to a more clear separation, and the Views would not need to know anything about the HTML/CSS generated by the UserControl, but at the cost of a fixed look of the control.
Since I am totally new to the framework, I'm guessing people have already come to some good conclusions about this.
So, would you have the UserControl handle its own CSS, should it depend on the CSS declared in the calling View, or is there another, better solution?
If you look at a skinable toolkit like Yahoo UI it documents the classes used by each control and then provides a single skin file for the entire toolkit. By swapping out the single skin file you can change looks for your entire site.
I would assume that 99.9% of the time you would want to custom skin your controls and not have them come predefined with a look and feel.
As an example here are the CSS defines for Yahoo's TabView control
It should always be in your global CSS really. If you pass this on to a designer, you dont want to have to explain which control defines x style, etc.
A quick point... it's ok for your Views to be aware of HTML... that's what they are for. What I would recommend (if you want to be ubber cool), is to add a parameter to your "MVC UserControl" that specifies the class name. Example:
<%= MyHelperClass.Marquee("This text will scroll!!!", "important-text") %>
I'm of course pretending that "important-text" is the class name that I want to add to my control.
I am assuming that when you say "UserControl", you're referring to an example like in that link above.