I'm using the new Bundling feature in ASP.NET MVC4. Currently I have the following bundles configured:
~/js/jquery
~/js/forms
˜/js/bootstrap
Depending on the view I'm serving I usually call a combination of these three (e.g. the home page on needs the jquery bundle, while the contact page needs jquery + bootstrap, while forms need all three).
My question would be: is there a way to call the three bundles to be rendered as one file from the view? I don't want to make bundles for every possible combination:
˜/js/formsAndBootstrap
˜/js/formsAndJQueryAndBootstrap
And so on...
bundles.Add(new ScriptBundle("~/bundles/formsAndBootstrap").Include(
"~/Content/Scripts/jquery-1.7.2.js",
"~/Content/Scripts/bootstrap.js",
"~/Content/Scripts/form.js"))
It appears you have to define a bundle. It can't be done "on-the-fly" from the view.
Related
When you add Identity to your ASP.NET Core applications, you can scaffold its Razor pages.
I am looking for a way to extract my views from a referenced RCL just like Identity.
I mean I want to create Area and related files (cshtml) to help developers to customize it (not a specific UI as you see in the above pic).
Do there exist any command-line tools to a way to extract Razor pages (.cshtml)?
I checked inside of a Razor class library with dotpeek there is no HTML resource, everything is class.
Any idea?
Is it best practice for ALL text on a .Net Core Razor webpage to be injected with Model Binding (Even on a static page), or should I only inject text which may need to change dynamically at runtime?
E.g. My Index.cshtml page has a h1 title as per below. Is this considered bad practice or is it ok?
<h1 class="block-title-text" localize-content>A Fun Title</h1>
Thanks. Just trying to get my head around Razor and .Net Core.
This if fine, in general you should keep user interface elements in the view (or the .cshtml file for Razor Pages). See benefits of using views for more details, which among other things includes:
The parts of the app are loosely coupled. You can build and update the app's views separately from the business logic and data access components. You can modify the views of the app without necessarily having to update other parts of the app.
Just realised something which is obvious in hindsight. By injecting the strings using Model Binding instead of placing them into the HTML as above, it allows the incorporation of unit tests around those strings.
I've seen in some sample code that a route template ("{id:int}") on top of razor page causes the links to that page to use another pattern:
https://localhost/Movies/Edit/6
instead of
https://localhost/Movies/Details?id=6
My question is how asp.net manages to change all the links to that pattern, does it know about that page before rendering it?
Does it collaborate with other pages when processing a page?
When the application first starts, a collection of attribute routes are built. The routes are built for any Razor file with an #page directive in the root Pages folder, and for any other routes that have been defined via PageRouteConventions.
When you use the Url helper to generate links, or the anchor tag helper (which uses the Url helper behind the scenes), the link that gets generated is based on the attribute route that was built for the page that you pass to the helper.
In attribute routing, route parameters are added as segments in the URL, which is why the values are not appended as query string values. If you prefer query strings, don't declare route values as part of the #page directive.
Run the dotnet publish -c Release command and take a look inside the bin/Release folder.
You will not find your .cshtml files with html in them. What happaned where did all the html go? And how does this relate to the question?
You gotta remember that cshtml will endup being your regular ol' c# and all that fancy razor templating syntax end's up being c#. This process has many names and transpilation is one of them performed by transpilers.
Okey so now that we can safely assume that when you have a Index.cshtml file it will get populated in to some sort of an object, let's call it RazorPage.cs this will just store all the configuration for this page. Now let's say this index page is living in a folder called Home now we can have a dictionary Dictionary<string, RazorPage> and let's say that the key will be "/Home/Index". Following along based on transpiled #page "{id:int}" syntax, it might generate a template string for the route and store that in the RazorPage in a RouteTemplate parameter.
So when you use asp-page tag helper it will find the correct RazorPage and it can know the template for the url, populating it with the values you provided.
I haven't seen the actual implementation this is just my guess.
My question is how asp.net manages to change all the links to that pattern, does it know about that page before rendering it?
Yes it knows everything about the page at run time. Most likely the services.AddMvc() service takes care of loading in all the razor pages / views / controllers, at startup.
Does it collaborate with other pages when processing a page?
Highly likely no, unless you mean components/layouts/partials. It will however struggle to resolve a page if you have identical route for 2 pages.
In my MVC project I use both Web Optimizer and Cassette. The main reason I choose Cassette is because it has the ability to "inject" javascript and css to the html header/bottom body section from partial view or child action (or from anywhere). The reason I still use Web Optimizer is because it can have different bundles for files in the same directory (in comparison that Cassette default one bundle per folder, which does not work sometimes, for example, many different themes are in just one folder because they share files).
In my project I used a lot of third party jQuery plugins in different places. I bundled them together, and then in different pages I use the Bundles.Reference() to add to a page when it is needed. For example, in one page, I could use 5 plug-ins, and another page could use 6 plug-ins.
Bundles.Reference("content/plugins/plug1.js", "body");
Bundles.Reference("content/plugins/plug2.js", "body");
Bundles.Reference("content/plugins/plug3.js", "body");
When the page is rendered, Cassette would generate a tag for each of the references.
The main reason we use bundle is to try to reduce the requests to server whenever it is possible. But in this situation, the Cassette does not reduce the requests for javascript. It just like the same thing that I add the tag for each plugin (but I cannot inject to header/body bottom from partial view/child action).
So my question comes: is it possible that Cassette can "bundle" the different References that I use in different pages into just one single tag?
Many thanks in advance!
I'm new to web development and ASP.NET MVC 4
My question is: Is it possible to replace the content of div tag without needing to refresh the whole page?
If so, what is the best practice of it (best use of MVC 4)?
In order to refresh partial content of a page, you have to use AJAX. There are plenty of resources available online describing how to implement this in ASP.NET MVC. One of the possibilities is using partial views, on which you can find a good tutorial here. However, if you're comfortable with javascript/jQuery a partial view might be overkill if you're just looking to update one div.
Use javascript and make an ajax call. MVC has a JsonResult for the controller you can use if you like.
Not 100% sure but if I remember right, jQuery is bundled with MVC4. Correct me if I'm wrong.
// Javascript code
$('#mydiv').load('/Content/html/mySnippet.html');
Would replace the contents of a <div id="mydiv"></div> with the contents of the /Content/html/mySnippet.html.
You can also call an action and return a partial view if you wish to have dynamic content instead of a static html template.