If you were using N2CMS MVC with the ASP.NET view engine, you would using the following code to add the Control Panel and a Zone to the page.
<n2:SlidingCurtain ID="sc" runat="server">
<n2:ControlPanel runat="server" EnableEditInterfaceIntegration="false" />
</n2:SlidingCurtain>
<n2:DroppableZone ID="Zone2" ZoneName="Left" runat="server" />
Is this even possible using the Razor view engine to enable the drag-n-drop zones? If so what is the syntax?
I have tried:
#{ Html.DroppableZone("Left").Render(); }
#{ Html.RenderZone("Left"); }
The above code renders the zone, but I am not sure how to enable the control panel or how to invoke the drag-n-drop style zone editing.
Turns out I was close.
Adding the following to the _Layout.cshtml enabled the Control Panel.
#{ Html.ControlPanel().Render(); }
And using DroppableZone enabled a target for the drag-n-drop.
#{ Html.DroppableZone("Left").Render(); }
Add the appropriate namespace to make sure the extension methods are available.
#using N2.Web.Mvc.Html;
Related
I can't find the reel intentions behind MVC-Razor layouts through internet.
In shared folder, there is :
_Layout.cshtml
_LoginPartial.cshtml
Should i use the _Layout for pages that dosen't require to be logged in, and use _LoginPartial for pages that require to be logged in ? Or am i completely lost ?
To make it simple :
If i create a new view that can only be reached when logged in, should it be beginning with
Layout = "~/Views/Shared/_Layout.cshtml";
or
Layout = "~/Views/Shared/_LoginPartial.cshtml";
?
Edit :
Checking tutorials and explanation from everyone (thanks all)
_Layout.cshtml is exactly like a master page in WEB FORM,
So i should always use :
Layout = "~/Views/Shared/_Layout.cshtml";
at the begining of a page i want to have formated like others.
The Login partial can be applied after authentification to alter the layout (disconnect button instead of connect, ect.)
The file _Layout.cshtml represent the layout of each page in the application. While partial view is a custom, reusable component that you can use in each page you need it. For example, we can create a partial view for customer and call it many time in page
<table class="table table-condensed">
#foreach (var student in Model.Students)
{
#Html.Partial("_StudentForm ", student)
}
</table>
So _Layout is meant to be used for all pages and _LoginPartial.cshtml can be used inside the page you need to have a login form in. Check this article about partial view
Tips and Tricks about Razor Partial Views
Layout = "~/Views/Shared/_Layout.cshtml";
in your view start file (_ViewStart.cshtml), may times its the ONLY thing in that file.
#{
Layout = "~/Views/Shared/_Layout.cshtml";
}
the _Layout.cshtml and _Viewstart.cshtml combo is similar to a master page in web applications but these will not have controller actions associated with them. if you set the layout setting in the _ViewStart file you don't need to set it in your actual views, they will inherit it from the viewstart file.
If you look inside the layout file you will see this line somewhere
#RenderBody()
That is where your individual views HTML will end up when your specific view is called.
The Login partial is just a quick start to demonstrate a view that can change display based on if the user is logged in or not.
You can use the same _Layout.cshtml but your controller ActionMethod should change to Authenticate. Use the below link for more info.
Authenticate User in MVC
Its more of a naming convention for layouts.
views will inherit it from the viewstart file. If you look inside the layout file you will see the renderbody method.
#RenderBody()
This is where the HTML code is read and shown in the browser.
The same goes for the _loginPartial.cshtml its just there for looks and to show you what Mvc is capable of.
Visual Studio creates the layout _Layout.cshtml when all but
the Empty project template is used. This layout is applied to all views by default through the /Views/_ViewStart.cshtml file.
If you do not want the default layout applied to views, you can change the settings in _ViewStart.cshtml (or delete the file entirely) to specify another layout in the view, like this:
#{
Layout = "~/Views/Shared/MyLayout.cshtml";
}
Or you can disable any layout for a given view, like this:
#{
Layout = null;
}
Hope this helps.
I ask a relevant question here and as I find there is no way to use custom control in Razor views, so I get to add new ASPX partial view to use custom control, my custom control is a dll that I added to References then define Partial view as the following:
<%# Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<System.DateTime?>" %>
<%# Register Assembly="JQControls" Namespace="JQControls" TagPrefix="PersianDatepicker" %>
<PersianDatepicker:JQLoader ID="jqdb" runat="server" />
<PersianDatepicker:JQDatePicker ID="jqdp1" runat="server" Regional="fa" />
I write the exact code in ASPX Web form and worked correctly but there is an exception in MVC:
Error executing child request for handler
'System.Web.Mvc.HttpHandlerUtil+ServerExecuteHttpHandlerWrapper'.
Exception of type 'System.Web.HttpUnhandledException' was thrown.
Object reference not set to an instance of an object.
So does any one have any idea about it?
Another question is how can I define a Html Helper for this user control (With dll and I have not access to code) ?
make a html iframe into view, loading a aspx page!
the "View" in MVC template should be standard HTML form.
you may use "Helper" to generate complex/re-useable HTML output but using any standard HTML+Javascript in UI is the way "MVC" works.
MVC allow parallel coding and HTML development. any developer who knows HTML+JS can create "View" without messing up your code.
this jquery plugin http://jqueryui.com/demos/datepicker/ can create custom DatePicker on client browser.
I am developing an MVC3 application using Visual Studio 2010.
I have an aspx page that I want to display as a result of a controller action.
I added this action to the home controller.
// GET: /Home/EmployeePortal
public ActionResult EmployeePortal()
{
return View();
}
This is the aspx page.
<%# Page Language="C#" Inherits="System.Web.Mvc.ViewPage<dynamic>" %>
<!DOCTYPE html>
<html>
<head runat="server">
<title>EmployeePortal</title>
</head>
<body>
<asp:TextBox ID="TextBox1" runat="server" />
<div>
This is employee portal
</div>
</body>
</html>
When I run the application, I am able to navigate to this page by using the url:
http://localhost:3990/Home/EmployeePortal
The problem is - When I have one or more server side control on the aspx page, I get this error on the website.
Sorry, an error occurred while processing your request.
When I comment out the server side control from the page, it displays fine.
The aspx page was added as a view to the application via add new view menu.
I need an aspx page integrated into the MVC application and thats why I am trying to use this aspx page.
I am not sure what I am doing wrong. Please help.
You don't use server side controls in ASP.net MVC.
You use the HTML Helper methods:
<%= Html.TextBox("TextBox1") %>
The server-side controls are not supported in MVC because MVC does not have the concept of ViewState.
Edit:
If you need to integrate MVC and WebForms, then you will need to create standalone Web Form pages. These will not be "Views" in your MVC application. You can then create routes to these web form pages by doing the following in your Global.asax:
public static void RegisterRoutes(RouteCollection routes) {
routes.MapPageRoute(
"WebFormProducts",
"/products/{category}",
"~/WebForms/Products.aspx"
);
}
Now when you go to /products/beverages it will actually go to your Products.aspx page that lives in the WebForms folder.
You create this Products.aspx file the same as a normal webforms page. The disadvantage to this (if nothing has changed) is you can not share a Master page / Layout page so you will have to duplicate any layout and create a .master to make the pages look similar.
Easy way to use aspx page on mvc controller for rdlc view
public ActionResult RdlcReport( )
{
IHttpHandler page = (IHttpHandler)System.Web.Compilation.BuildManager.CreateInstanceFromVirtualPath("~/Report/ReportDataViewer.aspx", typeof(Page));
HttpApplication controllerContextHttpContextGetService = (HttpApplication)ControllerContext.HttpContext.GetService(typeof(HttpApplication));
page.ProcessRequest(controllerContextHttpContextGetService.Context);
return new EmptyResult();
}
I want to use a different layout for all the Views in one folder. It's all my Panel views controlled by PanelController.vb
Function LogIn() As ActionResult
Return View()
End Function
Currently all the views in my project utilize _Layout.vbhtml for the layout etc.
How can I make these specific pages utilize e.g. _PanelLayout.vbhtml instead of the default?
See below of what files I am talking about:
I am using Visual Studio 2010, .NET MVC 3, Pages are Razor or something like that.
You can define the view's layout file at the top of the view -
#{
ViewBag.Title = "Index"
Layout = "~/Views/Shared/_PanelLayout.vbhtml"
}
The question specifically calls for vbhtml (or vb.net) page. The accepted answer is for cshtml (C#) razor page. The correct answer for vb.net is:
#CODE
Layout ="~/Views/Shared/_PanelLayout.vbhtml"
End Code
How can I use custom controls with ASPNET.MVC Razor?
I want to use a custom control on a Razor view. for instance:
<mycontrols:something>#Model.MyVar</mycontrols:something>
or
<mycontrols:something myattribute="#Model.MyVar" />
Please note that my goal is to use only few controls derived from MvcControl, only for trivial repetive ui stuffs.
I tried to find out a syntax similar to #Register to write on the top of the view, but without any success.
Then I went to the web.config, adding
<pages>
<controls>
<add tagPrefix="mycontrols" namespace="mynamespace" assembly="myassembly"/>
</controls>
</pages>
but it looks like custom controls are ignored in rendering.
Someone could help?
...Might be it is a little bit old fashion, but sometimes also custom control could be useful to make your code cleaner!
The Razor syntax does not support the notion of Controls at all. If you want to use controls you will have to use the ASPX (WebForms) syntax.
However, the recomended MVC pattern is to use html helper functions or partial views. In Razor you can also use the #helper syntax for quick helper functions.
In ASP.NET MVC custom server controls should be avoided. Most of them rely on ViewState and PostBack which are notions that no longer exist in MVC. You should prefer using templates, HTML helpers to implement some reusable functionality. Another problem with controls is most of them encapsulate some business logic which fetches data from somewhere and renders it which is an anti-MVC pattern. In MVC it is the controller responsibility to manipulate the model and fetch data and pass a view model to the view which simply should display it.
MVC uses partial views rather than custom controls, and they can be used in two ways that cover pretty much everything a custom control can do
RenderPartial which renders data already retrieved by the page controller
RenderAction which is similar but has its own controller action so can get data independently
The only scenario I can think of where it would be worth putting a custom control on an mvc view is if you are working on a partially migrated webforms project, and I doubt that would work with anything other than the WebFormsViewEngine.
You can do this, though I don't recommend it, though I'm not here to judge. I might add that I don't expect postback and view state to continue working either but you can at least render all of the html.
The only way to do this is a bit of a hack, because razor doesn't support webforms view engine controls. However, it does support partial views made in the webforms View engine. So a hacky solution is to include a partial view with your control in it as such:
For example, say you want to use the office web ui ribbon in your mvc3 project, you could do so by including
<body>
<div>
#Html.Partial("_RibbonPartial")
</div>
</body>
in your view. Where _Ribbon is of type .aspx
then in your partial view simply use your control and set runat="server" and put it inside of a form with runat="server"
//_Ribbon.aspx
<form id="form1" runat="server">
<XyzControls:Manager ID="Manager1" runat="server" UITheme="Silver" />
<XyzControls:OfficeRibbon ID="OfficeRibbon1" runat="server" ApplicationMenuColor="#267c29"
ApplicationMenuText="Item" ApplicationMenuType="Backstage">
//... rest of control code
</form>
Then you need to use ajax to implement events instead of using postback.
Then to cleanup, get rid of the generated code from webforms view engine for post back that you don't need.. You can try keeping it, I haven't so I'm not sure what will happen. I know there are ways to have a fake viewstate as well if you really want to get into messy hacky stuff, but to remove the extra code from webforms you can use the following jquery:
$(function ()
{
// we don't need any of the webforms stuff
$("#__EVENTTARGET","#aspnetForm").parents("div:first").remove();
$("#__EVENTVALIDATION","#aspnetForm").parents("div:first").remove();
});
I had the same demand. Wanted to use custom webcontrol from Razor/MVC page. One should not do that with controls, that is handling postback. You don't have the eventcycle to support that, but if your only demand is to use a 'rendering control', you could instantiate it in razor, and control where the rendering takes place:
#{
var myControl = new mycontrols.something();
myControl.myattribute = Model.MyVar;
mycontrol.RenderControl(new HtmlTextWriter(this.Output));
}