正确注册JavaScript和CSS在MVC 2编辑器模板

StackOverflow https://stackoverflow.com/questions/2530623

题

如何正确在ASP.NET MVC 2（RTM）编辑模板的javascript寄存器块？

我在具体的情况是，我想用 Dynarch JSCal2的DateTimePicker 我的标准日期时间选择器，但这个问题是一般于任何可重用的JavaScript包。我现在我的模板正常工作，但它有我的JS和CSS包括在我的母版页和我宁愿只包含这些东西，如果我确实需要他们：

<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>

所以，很显然我可以把这些线到我的模板，但以后我有了5个DateTimePickers屏幕，那么这些内容将被重复5次，这不是很理想。不管怎么说，我还是希望我的视图的模板来触发此代码被放进我的网页<head>。

虽然这是完全无关，我问这个问题，我想我会分享我在这里的模板（到目前为止）的情况下，它以任何方式有用的：

<%@ 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>
有帮助吗？

解决方案

我通常在由观点重写我的母版页添加脚本占位符：

站长：

<%@ 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>

查看：

<%@ 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>

通知的编辑模板是如何包括用于模型的三个不同的特性，但所需的脚本被包括一次。

其他提示

我建立一个简单的scritp管理来处理这个问题，不幸的是我没有完成它的CSS检查出的 Asp.Net MVC经理的JavaScript包括和CSS文件。不幸的是，它不是proeprly对CSS的工作，对JavaScript我只是简单地让他们在我的主文件的底部，但CSS必须在头标签，我还没有找到一个还没有办法做到这一点...

但使用我已经能够在自定义的HtmlHelper，DatePicker的，我有一个模板DateTime.ascx使用过的脚本。

在 Telerik的网络资产管理让你完成你想要的而且是开源的。

许可以下： CC-BY-SA 和 归因
不隶属于 StackOverflow
scroll top