Question

我正在尝试通过调用将局部视图中的javascript添加到layout.cshtml头部分 @RenderSection（＆＃34;脚本＆＃34;，必需：false）但失败了。请查看我的partialview页面代码。

@{
    Layout = null;
}

<div id="modal-login" class="ui-dialog ui-widget ui-widget-content ui-corner-all ui-front ui-dialog-buttons ui-draggable ui-resizable" title="Insert Student">
    @using (Html.BeginForm("Login", "Home", FormMethod.Post, new { id = "form-login" }))
    {
        <div style="width:320px; height:320px; padding:0px 15px 15px 15px;  border:solid 1px silver">

            <div style="width:310px; height:30px; padding-bottom:0px; border:solid 0px red">
                <div style="width:320px; height:30px; float:left;">
                    <div id="loading" style="height:15px; width:120px">
                    </div>
                </div>
            </div>

            <div style="width:310px; height:30px; padding-bottom:35px; border:solid 0px red">
                <div style="width:320px; height:30px; float:left;">
                    <input type="text" class="textbox" id="tbEmailAddress" name="tbFirstName" size="50" placeholder="First Name" />
                </div>
            </div>

            <div style="width:310px; height:30px; padding-bottom:35px; border:solid 0px red">
                <div style="width:320px; height:30px; float:left;">
                    <input type="text" class="textbox" id="tbPassword" typeof="password" name="tbFirstName" size="50" placeholder="First Name" />
                </div>
            </div>

            <div style="width:320px; height:20px; padding-top:5px; padding-bottom:15px; border:solid 0px red; font-size:9px;">
                <div style="width:310px; height:30px; float:left;">
                    <input id="btnLogin" class="submit ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only" type="submit" value="Submit" style="border:1px solid gray; width:80px; height:25px ">
                </div>
                <div style="width:140px; height:30px; float:left;">

                </div>

            </div>

        </div>
    }
</div>

@section scripts
{

<script type="text/javascript">



        $(document).ready(function () {

            $("#modal-login").dialog({
                show: "slide",
                modal: true,
                autoOpen: false,
              });


            $("#btnLogin").click(function () {
                $("#modal-login").dialog("open");
                return false;
            });
        });

    </script>

}

以下是layout.chtml head section，其中iam在第二行代码中调用@RenderSection（＆＃34; scripts＆＃34;，required：false）。

 <!DOCTYPE html>
    <html>
    <head>
        <meta charset="utf-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>@ViewBag.Title - My ASP.NET Application</title>
        @Styles.Render("~/Content/css")
        @Scripts.Render("~/bundles/jquery")
        @*@Scripts.Render("~/bundles/jqueryui")*@


        <link href="~/Content/themes/base/jquery-ui-1.10.4.custom.css" rel="stylesheet" />
        @*<script src="~/Scripts/jquery-1.10.2.js"></script>*@
        <script src="~/Scripts/jquery-ui-1.10.4.custom.js"></script>

        @RenderSection("scripts", required: false)
</head>

请查看我的代码并建议我是否遗漏了什么？感谢。

Answer 1

订单@section脚本在partialView中不起作用，擦除它和你的脚本工作。

但为什么你试着把脚本放在脑袋里？

你在头部调用JQuery，部分视图中的脚本不是必需的。

但是，如果我理解您的代码，您可以在部分视图中创建一个登录表单，以便在布局中插入以便在整个网站中使用？

如果你直接在布局的头部编写脚本，那么更容易，但更好的是创建一个包含所有自定义脚本的脚本文件，将其与一个包中的其他脚本混合，最后在头部调用此包，这样你的网站就会更快。

如何将javascript从局部视图添加到layout.cshtml页面

1 个答案: