asp.net-mvc – 在自定义编辑器中只包含一次脚本

所以我正在尝试创建一个自定义编辑器,以便对于“持续时间”的数据类型,出现一个带有掩码格式为HH：MM：SS的文本框.

到目前为止,我已经创建了一段非常简单的代码

@Html.TextBox("",ViewData.TemplateInfo.FormattedModelValue,new { @class = "text-Box single-line",type = "duration" })

<script>
    $(document).ready(function () {
        $("#@Html.NameFor(c => c)").mask("00:00:00");
    });
</script>

这是在我的〜/ Views / Shared / EditorTemplates / Duration.cshtml文件中.但是它需要加载额外的javascript(maskedInput.js).

有没有我可以在这里使用的剃刀包含,以便我可以在页面加载中只包含一次maskedInput.js文件.我意识到我可以将它添加到编辑器将在的父页面上(但这需要知道使用此编辑器的每个页面).我可以将它添加到主布局视图,但这将意味着不使用此编辑器的页面的开销.

所以我总结一下,我要问的是： – “有没有办法在EditorTemplate中包含一次javascript文件,只有一次”.

解决方法

我为此专门编写了一个 nuget package,并写了 YD1m所提到的博客文章.

要使用该软件包,首先需要在布局中的某处添加对Html.RenderScripts()的调用,以便在渲染Razor视图期间使用帮助程序添加所有脚本文件引用和块.响应.此调用的典型位置是在顶级布局中的核心脚本之后.这是一个示例布局：

<!DOCTYPE html>
<html lang="en"> 
    <head>
        <Meta charset="utf-8">
        <Meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
        <title>@ViewBag.Title</title>
        <Meta name="viewport" content="width=device-width">
    </head>
    <body>       
        @RenderBody()           
        <script src="~/Scripts/jquery-2.0.2.js"></script>
        @* Call just after the core scripts in the top level layout *@
        @Html.RenderScripts()    
    </body>
</html>

如果您使用的是Microsoft ASP.NET Web Optimization框架,则可以使用Html.RenderScripts()的重载来使用Scripts.Render()方法作为生成脚本的函数：

@Html.RenderScripts(Scripts.Render)

完成后,现在您需要在编辑器模板中执行的操作是使用nuget包中的帮助程序添加对脚本的引用并添加代码块

@Html.TextBox("",type = "duration" })

@using (Html.BeginScriptContext())
{
    Html.AddScriptFile("~/Scripts/maskedInput.js");
    Html.AddScriptBlock(
        @<script>
            $(document).ready(function () {
                $("#@Html.NameFor(c => c)").mask("00:00:00");
            });
        </script>);
}

引用的脚本文件只会添加一次到页面,所有脚本块将在Html.RenderScripts()调用结束时写出.

使用帮助程序,您可以在视图,部分视图和编辑器/显示模板中添加脚本文件和脚本块.请注意,当通过AJAX调用时,当前版本(1.1.0.0)不会使用帮助程序渲染脚本,但这是我希望在下一个版本中添加的内容.

asp.net-mvc – 在自定义编辑器中只包含一次脚本

解决方法

相关文章