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

我试图通过调用 @RenderSection（“scripts”，required：false）从部分视图向layout.cshtml头部分添加javascript，但失败。请查看我的partialview页面代码。如何将javascript从部分视图添加到layout.cshtml页面

@{ 
    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头部分，在那里（需要“脚本”，：假）IAM主叫@RenderSection在代码的第二最后一行。

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

请查看我的代码，并建议如果我错过了什么？谢谢。

来源

2014-11-03 user3004110

部分不按设计在部分视图中工作。复制[将内容注入到具有Razor View Engine的ASP.NET MVC 3的部分视图中的特定部分]（http://stackoverflow.com/q/7556400/1199711） – Zabavsky 2014-11-03 13:55:51

'但失败 - - 描述在此上下文中失败的方法。该脚本不工作，没有呈现，是否有例外？ – 2014-11-03 13:55:58

失败的意思！我尝试从局部视图中将java脚本代码添加到layout.cshtml的头部分。 – user3004110 2014-11-03 14:05:09

订购@section脚本不能在partialView中工作，擦除和脚本工作。

但你为什么试图把脚本放在头部？

您在头部调用JQuery时，局部视图中的脚本在头部不是必需的。

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

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

来源

2014-11-03 14:19:01 Pablote

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

回答

相关问题