What is the right way to '#include file' in MVC? - asp.net-mvc

I would like to do something like this:
<!--#include file="../stuff/foo/box.aspx"-->
But doing this in an ASP.Net MVC application it just feels wrong. Is there a better way of achieving the same thing in a ASP.Net MVC project ?

<%: Html.Partial("~/Views/foo/box.ascx") %>
or:
<% Html.RenderPartial("~/Views/foo/box.ascx"); %>
or the best of them all use an editor template (if this partial contains inputs for editing the view model property):
<%: Html.EditorFor(x => x.MyModelProperty) %>
or a display template (if this partial contains only display of view model property):
<%: Html.DisplayFor(x => x.MyModelProperty) %>
and their Razor equivalence
#Html.Partial("~/Views/foo/box.ascx")
#{Html.RenderPartial("~/Views/foo/box.ascx");}
#Html.EditorFor(x => x.MyModelProperty)
#Html.DisplayFor(x => x.MyModelProperty)

You should make a partial view.

You can use
Html.RenderPartial('~/Views/Login/Box.ascx');
RenderPartial allows to render part of the page using the same context. If you want to render using new context, use
Html.RenderAction("Box","Login"); //Box - Action, Login - Controller

Related

Kendo UI Grid RowTemplate with Action<T> parameter on Razor View Engine

I'm tring to use Kendo UI Grid component and need to create my custom row template. Actually the gird is really awasome and usage is so cool. But some how I could'nt get display my custom row template.
I need the whole model (I mean whole entity object to display aditional data but not display titles for them on column headers, like images of sub-itmes), so I'm trying to use RowTemplate(System.Action<T>) method that passes each entity for each row. For aspx pages, there is an example on their site as below:
<%= Html.Kendo().Grid(Model)
.RowTemplate(o =>
{
%>
<%= o.Name %>
<%= o.Age %>
<%
})
%>
But how to do this with razor? I couldn't get it. Should I use WriteLiteral or what? How to use Action<T> to display razor templates?
In razor you must use a template delegate:
.RowTemplate(#<text>
<strong>#item.Name</strong>
<span>#item.Age</span>
</text>);

Could a custom EditorTemplate invoke default EditorTemplate for the same model inside it [duplicate]

I am using EditorFor() helper to render edit template in my view and I would like to call the DisplayFor() inside this template to render out the Display template.
Like this
this is inside the /Shared/EditorTemplates/Client.ascx
<%# Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<BusinessNext.Models.Ef.Client>" %>
<%: Html.DisplayFor(client=>client) %>
In the DisplayFor template I render out client's properties. DisplayFor template works perfectly fine when called from everywhere else but from EditorFor template it doesn't render out anything. It seems that the DisplayFor() call never actually gets to the DisplayFor template.
I am afraid that the only way is to use a partial:
<%= Html.Partial("~/Views/Home/DisplayTemplates/Client.ascx", Model) %>
It can be debatable if it is a good idea to template complicated objects, or if my approach to nested templates is a hack or not. The advantage of this is having a single template for the parent and child can both have templates rather than having to choose/use partial views.
All that aside, templated views can be nested, if you use a partial view as an go between.
The outside template will have something like below where you want to place the inner template:
Html.RenderPartial("SharedDisplayGoBetweenForFoo", item);
The shared partial would look like this:
#model Foo
#Html.DisplayFor(a => a);
The inner template would then be called and would look like any other.

RenderPartial control in same view folder

I have a file in my view folder Users called UserViewControl.cshtml.
My code in the actual view (Users.cshtml) is:
#Html.RenderPartial("RegisterViewControl")
Error:The best overloaded method match for 'System.Web.WebPages.WebPageExecutingBase.Write(System.Web.WebPages.HelperResult)' has some invalid arguments
I do not want to type the path fully like this as the whole view folders might move in the future:
#Html.RenderPartial("~/Views/Users/RegisterViewControl.cshtml")
Code in RegisterViewControl.cshtml:
#model SampleMVC.Web.ViewModels.RegisterModel
#using (Html.BeginForm("Register", "Auth", FormMethod.Post, new { Id = "ERForm" }))
{
#Html.TextBoxFor(model => model.Name)
#Html.TextBoxFor(model => model.Email)
#Html.PasswordFor(model => model.Password)
}
This is a form that will be submitted by ajax, but I want all the validation from the viewmodel.
It should be like this:
#{Html.RenderPartial("RegisterViewControl");}
And that's because the RenderPartial extension method doesn't return anything. It writes directly to the output. In aspx you use it like this:
<% Html.RenderPartial("RegisterViewControl"); %>
instead of:
<%= Html.RenderPartial("RegisterViewControl") %>
So the same rules apply for razor.
You could alternatively use
#Html.Partial("RegisterViewControl")
I had this issue as well and got this directly from Scott Guthrie's blog post:
using #Html.RenderPartial() from a Razor view doesnt work.
Rather than call Html.RenderPartial() use just
#Html.Partial("partialname")
That returns a string and will work.
Alternatively, if you really want to use the void return method you
can use this syntax:
#{Html.RenderPartial("partialName")}
But #Html.Partial() is the cleanest.
The link for this is: http://weblogs.asp.net/scottgu/archive/2010/12/30/asp-net-mvc-3-layouts-and-sections-with-razor.aspx

Passing an entire ViewModel into a DisplayTemplate?

We are doing our damnedest to NOT use RenderPartial but instead to use EditorFor and DisplayFor in 100% of cases. However, there is one scenario that we haven't been able to get to work so far: When the partial view needs the entire ViewModel, or in other words, when it needs to be Html.DisplayFor(m => m, "MyTemplateThatNeedsTheEntireViewModel"). It works fine if it's Html.DisplayFor(m => m.Prop, "MyTemplateThatOnlyNeedsTheOneProperty") but we can't pass the entire ViewModel in.
Is there a way to achieve this that will work both with DisplayFor and EditorFor?
What I see now is that either nothing (or perhaps whitespace) is rendered to my markup. However, both the compiler and ReSharper seem to think my syntax is just fine. Changing my code to call RenderPartial works perfectly, but this is what I'm trying to avoid.
I try these three lines. The RenderPartial works perfectly, the EditorFors do not work (eventual markup is an empty string or whitespace):
<% Html.EditorFor(m => m, "RetailPriceRequests/PriceRequest/PriceRequestLoadGrid"); %>
<%= Html.EditorFor(m => m, "RetailPriceRequests/PriceRequest/PriceRequestLoadGrid") %>
<% Html.RenderPartial("~/Views/Shared/EditorTemplates/RetailPriceRequests/PriceRequest/PriceRequestLoadGrid.ascx", Model); %>
If your DisplayTemplate is:
<%# Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<ExampleModel>" %>
DisplayFor(m => m, "ExampleModel")
should work
<%# Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<ExamplePropertyModel>" %>
DisplayFor(m => m.ExampleProperty, "ExamplePropertyModel")
should work
One issue you could be that something is null, in which case it probably shouldn't be hitting the View at all, but you can get around this by writing:
RenderPartial("ExampleModel", Model ?? new ExampleModel());
or
RenderPartial("ExampleModel",
(Model ?? new ExampleModel() { ExampleProperty = new ExampleProperty() })
.ExampleProperty ?? new ExampleProperty());

MVC - Multiple Strong Type object ...inside one view

After so many years using ASP.Net, I’m still trying to figure out how to achieve the same results using MVC.
I have a materpage with a control that is strongly type to something. When I navigate to a view of a different strongly type model ...and click on the button to execute something, I get "The model item passed into the dictionary is of type Site.Models.RegisterModel', but this dictionary requires a model item of type Site.Models.LogOnModel'".
For the sake of this example, we can take the Default MVC app that is provided with VS 2010, let’s imagine I want to change the “LogonUserControl.ascx” so that it either tells me the logged user (as it works currently) OR allow me to login from there, showing me the text boxes for username and password (therefore in this case from the home page).
So I take the control and strongly type it as:
<%# Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<Gioby.Models.LogOnModel>" %>
<%
if (Request.IsAuthenticated) {
%>
Welcome <b><%: Page.User.Identity.Name %></b>
[ <%: Html.ActionLink("Log Off", "LogOff", "Account")%> ]
<%
}
else {
%>
<% using (Html.BeginForm()) { %>
<div id="logon">
<div class="editor-label">
<%: Html.LabelFor(m => m.UserName)%>
<%: Html.TextBoxFor(m => m.UserName)%>
<%: Html.ValidationMessageFor(m => m.UserName, "*") %>
<%: Html.LabelFor(m => m.Password)%>
<%: Html.PasswordFor(m => m.Password)%>
<%: Html.ValidationMessageFor(m => m.Password, "*") %>
<input type="submit" value="Log On" />
</div>
<div class="editor-label">
<%: Html.ActionLink("Register here", "Register", "Account")%>
<%: Html.CheckBoxFor(m => m.RememberMe, new { #class = "pad-left" })%>
<%: Html.LabelFor(m => m.RememberMe) %>
</div>
</div>
<% } %>
<%
}
%>
Then on the HomeController, I add a procedure as:
[HttpPost]
public ActionResult Index(LogOnModel model, string returnUrl)
{
if (ModelState.IsValid)
{
// ==>> Check Login against your DB
// Now check if param returnUrl is empty
if (!String.IsNullOrEmpty(returnUrl))
return Redirect(returnUrl);
return RedirectToAction("Index", "Home");
}
// If we got this far, something failed, redisplay form
return View(model);
}
I tested it from the home page … it works !!!
BUT when I navigate to the “Register” view (remember that the “LogonUserControl.ascx” is located inside the “MasterPage”, therefore visible from the Register view).
So when I click on the Register button, I get the error:
The model item passed into the dictionary is of type Site.Models.RegisterModel', but this dictionary requires a model item of type Site.Models.LogOnModel'.
QUESTION:
Does that mean that I will never be able to different pieces together into one view?
Let’s say I want to write an eCommerce site and on the home page I want to see “Most used Tags”, “Most bought products”, “Product of the Month”, “List of Categories” …all within the same view and each one with his own HTTP POST action.
If this is possible using MVC?
If I'm understanding the problem correctly, you have two Views that use the same MasterPage, but which are strongly typed against different ViewModels. The master page is able to include a Partial View that is also strongly typed, as long as its expected ViewModel is the same as that of the parent view. However, if you're using a view with a different ViewModel type, it doesn't know what to do.
Consider the following:
<% Html.RenderPartial("LogOn") %>
The above code implicitly includes the model data for the current view being rendered. It's exactly the same as if you had said:
<% Html.RenderPartial("LogOn", Model) %>
So this will only work if Model is a LogOnModel. Remember that the MasterPage is really a part of whatever View inherits it, so even if you're putting this in the MasterPage, it's as if you'd put the same code in every view that inherits it. So if your View's Model is not the same as the PartialView's Model, this won't work. One alternative is to use inheritance to ensure that every ViewModel will include all the information required by the Master Page. This approach is described in detail here.
But that approach means that you have to always use a factory to produce your view model, and every view model has to be somewhat aware of which master page it will use. In our product, we can use a different master page on the same view depending on what mode the user is viewing the site in, so it doesn't make sense to tie the ViewModel to that of the Master Page. We accomplish what you're describing using the RenderAction method, which allows you to render an entire controller action as if it were just a part of the larger view. Some of the advantages of this approach are discussed here.
So now you can have your MasterPage include whatever little partial views you want, but you separate the logic for building the ViewModel of each of these Views into an individual controller action that's responsible for that particular Partial View:
<% Html.RenderAction("LogOnBox") %>
The Action:
public ActionResult LogOnBox()
{
LogOnModel model = GetLogOnModel();
return PartialView("LogOnUserControl", model);
}
Now, regardless of what model your current view uses, your Master Page can include “Most used Tags”, “Most bought products”, “Product of the Month”, “List of Categories”, etc. Better still, these portions of the page can leverage output caching so they don't have to be regenerated with every page load if they don't change very often.

Resources