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>

したがって、明らかにこれらの行をテンプレートに入れることもできますが、DateTimePickersが5つある画面がある場合、このコンテンツは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>

モデルの3つの異なるプロパティにエディターテンプレートが含まれているが、必要なスクリプトは1回だけ含まれていることに注意してください。

于 2010-03-27T19:33:39.937 に答える
3

これを処理するために簡単なscritp Manageを作成しましたが、残念ながらCSSについては行っていません.Asp.Net MVC Manager for javascript include and Css filesをチェックしてください。残念ながら、CSS では適切に機能しません。javascript では、マスター ファイルの一番下にあるだけですが、CSS は head タグにある必要があります。まだそれを行う方法が見つかりません...

しかし、それを使用して、テンプレート DateTime.ascx で使用するカスタム HtmlHelper、DatePicker にスクリプトを含めることができました。

于 2010-03-29T02:20:00.203 に答える
1

telerik Webアセットマネージャーを使用すると、必要なことを実行でき、オープンソースになります。

于 2010-07-15T22:48:53.230 に答える