How to use subfolders in the Pages and Shared folders - .net-core

I've got a Blazor Server-Side application. It has the folders Pages and Shared out-of-the-box. Since I have a lot of components in these folders, I wanted to distribute the components into multiple subfolders for a clearer structure. But if I do this, the components are not found and are not displayed in the GUI.
What am I missing? Do I have to register the routes to the new subfolders somewhere?

You can have whatever folder structure you wish. But you will need to update your _Imports.razor with the new namespaces.
For example if you have a structure of
MyProject/Components/Forms/MyInput.razor
You would need the following in your _Imports.razor:
#using MyProject.Components.Forms;
The other option is to reference components using their fully qualified namespace:
<MyProject.Components.Forms.MyInput/>

I am using partial classes for my code and not embedding code in the razor page, so I was a bit confused by the advice from Chris above and kept getting compile errors on my overrides in my partial classes after moving them into a new sub-directory.
Here is how I got it to work:
I had a page called EmployeeList.razor and a partial class called EmployeeList.razor.cs located in a project named Web.Client in the Pages folder. That means the following:
The namespace of the EmployeeList.razor page by default is Web.Client.Pages
My partial class is using the same namespace
If I move EmployeeList.razor and EmployeeList.razor.cs files to a sub-folder under Pages called EmployeePages, the EmployeeList.razor page will now have a new namespace of Web.Client.Pages.EmployeePages. That means that I need to also change my partial class' namespace to match or it will not be able to override methods.
The only other issue I ran into was not paying attention to the the folder name I used. I initially used a sub-folder named Employee (as in Pages\Employee\EmployeeList.razor) and this created a namespace for the razor page of Web.Client.Pages.Employee and I started having issues with an Employee.cs class I was using in my partial class since it thinks I'm trying to use a namespace rather than a class name. Since the path of the page is determined by the #Page directive on the razor page, the folder names really only determine the namespace of the razor page so I changed the sub-folder name to EmployeePages.
I did not find that I needed to update the _Imports.razor page with the new namespace, but I'll keep it in mind in case things stop compiling properly.

Related

How to use one partial view in Two MVC Project for same solution

I have two mvc projects in the same solution. The parent project Name is WebAPP and the child project name is SocialMedia.
In the SocialMedia project I have a partial view named
"_partialSocialMedia.cshtml".
I am using it easily in the SocialMedia project, as follows:
#{
Html.RenderPartial("~/Views/Shared/_partialSocialMedia.cshtml");
}
I want to use the same partial view into the parent project without re-creating it. I have tried to use it like this:
#{
Html.RenderPartial("~/SocialMedia/Views/Shared/_partialSocialMedia.cshtml");
}
But it is giving me an error as the view is not found in the specific path.
I have tried a lot of tricks using different path specifications.
Please note: I have already added the SocialMedia project as a reference into WebApp (the parent project) and the partial view exist in the following folder: SocialMedia>Views>Shared>_partialSocialMedia.cshtml.

Are you allowed to create seperate ASP bundles for resources in the same directory?

Suppose I have a directory with multiple css files. Is there a way to create and reference multiple ASP bundles for the same directory?
Let's say you have a folder with several stylesheets.
I know you can include specific files by their virtual paths like this:
//Bundle1
bundles.Add(new StyleBundle("~/Content/themes/base/css").Include(
"~/Content/themes/base/jquery.ui.core.css",
"~/Content/themes/base/jquery.ui.resizable.css",
"~/Content/themes/base/jquery.ui.selectable.css",
"~/Content/themes/base/jquery.ui.accordion.css",
"~/Content/themes/base/jquery.ui.autocomplete.css"));
What if I add another bundle, and this one includes stylesheets that are in the same directory as the previous bundle?
//Bundle2
bundles.Add(new StyleBundle("~/Content/themes/base/css").Include(
"~/Content/themes/base/jquery.ui.button.css",
"~/Content/themes/base/jquery.ui.dialog.css",
"~/Content/themes/base/jquery.ui.slider.css",
"~/Content/themes/base/jquery.ui.tabs.css",
"~/Content/themes/base/jquery.ui.datepicker.css",
"~/Content/themes/base/jquery.ui.progressbar.css",
"~/Content/themes/base/jquery.ui.theme.css"));
Now that I've created the bundles, I want to reference them.
I know I can call the following if there was just one bundle for the directory
#Styles.Render("~/Content/themes/base/css", "~/Content/css")
The problem I'm having with Styles.Render though is that it only accepts a virtual path to a path. Lets say you create more than one bundle in the same directory (if that is even possible). You can't use Styles.Render to select which bundle you want. You can only give it a path. Is there another way to reference a bundle you create in BundleConfig without Styles.Render?
Or is Styles.Render is the only way to reference any style bundle in the HTML?
Are you allowed to create seperate ASP bundles for resources in the
same directory?
Yes
How would I reference these bundles with the Styles.Render method?
#Styles.Render("~/Content/CssBundle1")
#Styles.Render("~/Content/CssBundle2")
The important thing to illustrate here is the reasoning behind bundling and the intended use of it. Bundling exists to reduce the number of requests and improve the load time of your application. You could do this manually, but you would have spaghetti code to manage. The bundling is there to keep everything modularized and easily organized.
Where I think there might be confusion
StyleBundle("~/Content/magicaunicornsdacningonrainbowsthisnameisrelative")
When you create a bundle, the virtual path can be named whatever you want. You bundle it in categories that makes sense.
//Bundle1
bundles.Add(new StyleBundle("~/Content/pets").Include(
"~/Content/dog",
"~/Content/cat",
//Bundle2
bundles.Add(new StyleBundle("~/Content/cities").Include(
"~/Content/memphis.css",
"~/Content/bejing.css",
//Bundle3
bundles.Add(new StyleBundle("~/Content/people").Include(
"~/Content/joseph.css",
"~/Content/michael.css",
With the bundles created, you make sure to call the bundles in the order you need them, loading only what is needed for each page.
#Styles.Render("~/Content/pets", "~/Content/cities")
* LOTS OF STUFF LOADED HERE! BUT YOU DO NOT NEED THE PEOPLE BUNDLE RIGHT AWAY *
#Styles.Render("~/Content/people")
You would simply create a different bundle for that references all the needed files, and you would call that bundle as needed. If you need to break up the order in which a file renders scripts or styles then you have multiple bundles. MVC is a lot about proper modularization, so you're always working up towards a root or singularity.
Getting more advanced
Obviously you can kick it up a notch. The next steps include using .less or .sass preprocessors for your style bundles. Those will help with very detailed modularization. Next, you can start using variables and conditions to determine which bundles should be run, linked below.
Or is Styles.Render is the only way to reference any style bundle in
the HTML?
There are other ways to reference css files via code. For instance, you could write a simple for loop to accomplish the task of writing the needed css scripts. Additionally, you could use razor variables.
Resource
Variables in Styles.Render
http://www.asp.net/mvc/overview/performance/bundling-and-minification

ASP.Net MVC: Centralizing CSS and JS dependencies

I'm using jQuery plugins in an ASP.Net MVC site.
I've often to include CSS and JS files as required by the plugins I use in every page. So I want to centralize all those dependencies in a single place in my app. thus if a dependency for a given plug-in is changed or updated, I'll only have to modify a single place in my app.
I've thought in two possible solutions:
Extend the HTMLHelper with a partial method
like GetPlugin("jqgrid"); that
will print out all the script and
style tags needed.
Create a partial view for each
pluginlike jqGridDependencies.ascx
that will contain the script and
style tags needed.
Do you have any other idea? what do you think of both proposals?
Could http://combres.codeplex.com/ provide you with a framework for this.
My only personal objection to this method is that each individual pages will have a unique JavaScript/CSS file where as if you combined and compressed everything into one and simply used classes and events to trigger the JavaScript enhancements as and when needed your site would run a lot faster.

Using directives in new files

Is it possible to have additional "using" directives automatically added to my new aspx.cs files so that I do not have to keep typing the same ones over and over again (i.e. custom namespace using directives)
You can edit the files that are used by the template. Better yet, create your own. File + Export Template.
You don't have to type them in. When writing the code, type in the name of the class (without the namespace). Then hit CTRL+.. That will open up the resolve type intellisense helper. It will add the using statement to the top of the file. No scrolling necessary.

Where is the class view for a code behind file in VS 2005

I can't seem to find any of my code behind files in the class view tab. I can see other classes that I have added but none of the code behind files. Is there a reason for this? I am missing a setting or something? It is quite irritating trying to navigate my way through the code all the time.
I can see all the other classes just fine just not my code behind files.
Class View is intended to provide a hierarchical view of the "symbols" defined in your project. For website projects, it will only list the referenced assemblies and any classes defined in App_code.
So, no, you aren't missing a setting. You're missing the point of the Class View window ! ;-) Maybe you should be looking in the Solution Explorer instead.
BTW, if you're having trouble navigating through code files, you should consider better organizing your files (in folders, for instance).
Edit (after a Bounty has been placed on this question... drool! ) :
Okay, I have VS 2005 SP1. I tried the following cases:
a. Create New Website (VB or C#):
The Class View window is blank until you add an App_Code folder. When added, the Class View window displays any classes added to the App_Code folder and the default Project references (System, System.Web, etc). It does not however display any Page code-behind classes.
b. Create New Project -> Web -> ASP.NET WebApplication:
The Class View window auto-populates with the Project references and the Page code-behind classes. This happens before I added any folder containing class files.
I am not sure if you are familiar with the ASP.NET Web Application Projects. If not, you need to have the Service Pack for VS 2005 installed. You can get it here. Else, you can also install the Web Application Projects extension directly.
Don't be placing classes other than the class backing the page in code-behind. Place all other code in a separate library project or at the very least in the App_Code folder.
There should be a drop down menu right above the code. The left on is the classes in your open file and the right are members of the selected class.
A great way to navigate code in Visual Studio is with the right-click context menu's Go to Definition and Go to Declaration options.
You could also use Reflector on your assemblies to view the class/member hierarchy in a tree.
VS 2008 improves the class view to what you want ... just saying.
Edit: Nevermind, VS2005 should do what you want as well. You can use the Object Browser as well.

Resources