6

如何在 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>
4

3 回答 3

4

我通常在我的母版页中添加一个脚本占位符，该占位符被视图覆盖：

掌握：

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

请注意编辑器模板是如何包含在模型的三个不同属性中的，但所需的脚本只包含一次。

于 2010-03-27T19:33:39.937 回答
3

我构建了一个简单的脚本管理来处理这个问题，不幸的是我还没有为 CSS 完成它，请查看Asp.Net MVC Manager for javascript include and Css files。不幸的是，它不适用于 CSS，对于 javascript，我只是将它们放在我的主文件的底部，但 CSS 必须在 head 标签中，我还没有找到一种方法来做到这一点......

但是使用它，我已经能够在自定义 HtmlHelper、DatePicker 中拥有脚本，我将其与模板 DateTime.ascx 一起使用。

于 2010-03-29T02:20:00.203 回答
1

Telerik 网络资产管理器允许您完成您想要的并且是开源的。

于 2010-07-15T22:48:53.230 回答