2014-11-03 39 views
0

我試圖通過調用 @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> 

請查看我的代碼,並建議如果我錯過了什麼?謝謝。

+0

部分不按設計在部分視圖中工作。複製[將內容注入到具有Razor View Engine的ASP.NET MVC 3的部分視圖中的特定部分](http://stackoverflow.com/q/7556400/1199711) – Zabavsky 2014-11-03 13:55:51

+0

'但失敗 - - 描述在此上下文中失敗的方法。該腳本不工作,沒有呈現,是否有例外? – 2014-11-03 13:55:58

+0

失敗的意思!我嘗試從局部視圖中將java腳本代碼添加到layout.cshtml的頭部分。 – user3004110 2014-11-03 14:05:09

回答

0

訂購@section腳本不能在partialView中工作,擦除和腳本工作。

但你爲什麼試圖把腳本放在頭部?

您在頭部調用JQuery時,局部視圖中的腳本在頭部不是必需的。

但是,如果我瞭解您的代碼,您在部分視圖中創建登錄表單,以便在整個網站中使用佈局插入?

如果你在佈局的頭部直接編寫腳本,那麼更容易,但更好的是創建一個包含所有自定義腳本的腳本文件,將其與其他腳本混合在一個包中,最後在頭部調用該包,這樣你的網站會更快。