vue - Registro apropiado de JavaScript y CSS en MVC 2 Editor Templates
update partial view using ajax (3)
¿Cómo registro correctamente los bloques de JavaScript en una plantilla de Editor ASP.NET MVC 2 (RTM)?
El escenario específico en el que estoy es que quiero utilizar Dynarch JSCal2 DateTimePicker para mi selector de fecha y hora estándar, pero esta pregunta es, en general, para cualquier paquete javascript reutilizable. Tengo mi plantilla funcionando correctamente ahora pero tiene mi JS y CSS incluida en mi página maestra y prefiero solo incluir estas cosas si realmente las necesito:
<link rel="stylesheet" type="text/css" href="../../Content/JSCal2-1.7/jscal2.css" />
<link rel="stylesheet" type="text/css" href="../../Content/JSCal2-1.7/border-radius.css" />
<script type="text/javascript" src="../../Scripts/JSCal2-1.7/jscal2.js"></script>
<script type="text/javascript" src="../../Scripts/JSCal2-1.7/lang/en.js"></script>
Así que obviamente podría poner estas líneas en mi plantilla, pero si tengo una pantalla que tiene 5 DateTimePickers, este contenido se duplicará 5 veces, lo que no sería ideal. De todos modos, todavía quiero que la Plantilla de mi Vista active este código en el <head>
de mi página.
Si bien no tiene ninguna relación con mi pregunta, pensé en compartir mi plantilla aquí (hasta ahora) en caso de que sea útil de alguna manera:
<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<DateTime>" %>
<%= Html.TextBoxFor(model => Model) %>
<input type="button" id="<%= ViewData.TemplateInfo.GetFullHtmlFieldId("cal-trigger") %>" value="..." />
<script type="text/javascript">
var <%= ViewData.TemplateInfo.GetFullHtmlFieldId("cal") %> = Calendar.setup({
trigger : "<%= ViewData.TemplateInfo.GetFullHtmlFieldId(string.Empty) %>",
inputField : "<%= ViewData.TemplateInfo.GetFullHtmlFieldId(string.Empty) %>",
onSelect : function() { this.hide(); },
showTime : 12,
selectionType : Calendar.SEL_SINGLE,
dateFormat : ''%o/%e/%Y %l:%M %P''
});
</script>
Normalmente agrego un marcador de posición de script en mi página maestra que se reemplaza por las vistas:
Dominar:
<%@ Master Language="C#" Inherits="System.Web.Mvc.ViewMasterPage" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title></title>
<asp:ContentPlaceHolder ID="Styles" runat="server" />
</head>
<body>
<asp:ContentPlaceHolder ID="MainContent" runat="server" />
<script type="text/javascript" src="scriptAvailableToAllPages.js"></script>
<asp:ContentPlaceHolder ID="Scripts" runat="server" />
</body>
</html>
Ver:
<%@ Page Language="C#"
MasterPageFile="~/Views/Shared/Site.Master"
Inherits="System.Web.Mvc.ViewPage<Ns.MyModel>" %>
<asp:Content ID="indexScripts" ContentPlaceHolderID="Scripts" runat="server">
<script type="text/javascript" src="specific.js"></script>
</asp:Content>
<asp:Content ID="MainContent" ContentPlaceHolderID="MainContent" runat="server">
<% using (Html.BeginForm()) { %>
<%= Html.EditorFor(x => x.Date1) %>
<%= Html.EditorFor(x => x.Date2) %>
<%= Html.EditorFor(x => x.Date3) %>
<input type="submit" value="OK" />
<% } %>
</asp:Content>
Observe cómo se incluye la plantilla del editor para tres propiedades diferentes del modelo, pero los scripts necesarios se incluyen solo una vez.
Construir un simple scritp Administrar para manejar esto, desafortunadamente no lo he hecho para CSS echa un vistazo a Asp.Net MVC Manager para javascript include y archivos Css . Desafortunadamente, no está funcionando adecuadamente para CSS, para JavaScript simplemente los tengo en la parte inferior de mi archivo maestro, pero CSS debe estar en la etiqueta principal, todavía no he encontrado una manera de hacerlo ...
Pero al usar eso he podido tener script en un HtmlHelper personalizado, DatePicker que uso con una plantilla DateTime.ascx.
El administrador de activos telerik web le permite lograr lo que desea y es de código abierto.