2013-01-22 72 views
1

我看過什麼必須是100個帖子,無法在我的新項目中使用它。我已經得到了所有的腳本,它看起來像是簡單的測試,並且在webconfig中設置了不顯眼的東西,但仍然沒有運氣讓actionlink取代div中的文本。 Firebug報告所有腳本已成功加載,代碼如下。如果任何人都可以提供幫助,我將非常感謝,並且爲您提供虛擬啤酒!Mvc4 Ajax呼叫打開新頁面

控制器:

public ActionResult AjaxTest() 
{ 
return Content("Ajax Test Successful"); 
} 

查看:

@{ 
ViewBag.Title = "User"; 
} 

<h2>Users</h2> 

@Html.ActionLink("Ajax Test", "AjaxTest", "Admin", new AjaxOptions() { InsertionMode = InsertionMode.Replace, UpdateTargetId = "ajaxtest" }) 

<div id="ajaxtest"></div> 

佈局:

<!DOCTYPE html> 
<html lang="en"> 
<head> 
<meta charset="utf-8" /> 
<title>@ViewBag.Title - My ASP.NET MVC Application</title> 
<link href="~/favicon.ico" rel="shortcut icon" type="image/x-icon" /> 
<meta name="viewport" content="width=device-width" /> 
@Styles.Render("~/Content/css") 
@Scripts.Render("~/bundles/modernizr") 
</head> 
<body> 
<header> 
<div class="content-wrapper"> 
<div class="float-left"> 
<p class="site-title"> 
<img src="~/Images/logo.jpg" /></p> 
</div> 
<div class="float-right"> 
<section id="login"> 
@Html.Partial("_LoginPartial") 
</section> 
<nav> 
<ul id="menu"> 
<li>@Html.ActionLink("Home", "Index", "Home")</li> 
<li>@Html.ActionLink("Upload Files", "UploadFiles", "Upload")</li> 
<li>@Html.ActionLink("Upload History", "UploadHistory", "Upload")</li> 
<li>@Html.ActionLink("Help", "Help", "Home")</li> 
<li>@Html.ActionLink("Admin", "Home", "Admin")</li> 
</ul> 
</nav> 
</div> 
</div> 
</header> 
<div id="body"> 
@RenderSection("featured", required: false) 
<section class="content-wrapper main-content clear-fix"> 
@RenderBody() 
</section> 
</div> 
<footer> 
<div class="content-wrapper"> 
<div class="float-left"> 
<p>&copy; @DateTime.Now.Year - My ASP.NET MVC Application</p> 
</div> 
</div> 
</footer> 

@Scripts.Render("~/bundles/jquery") 
@Scripts.Render("~/bundles/jqueryval") 

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

高程毫升渲染頁面:

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="utf-8" /> 
    <title>User - My ASP.NET MVC Application</title> 
    <link href="/favicon.ico" rel="shortcut icon" type="image/x-icon" /> 
    <meta name="viewport" content="width=device-width" /> 
    <link href="/Content/site.css" rel="stylesheet"/> 
<link href="/Content/buttons.css" rel="stylesheet"/> 

    <script src="/Scripts/modernizr-2.5.3.js"></script> 

</head> 
<body> 
    <header> 
     <div class="content-wrapper"> 
      <div class="float-left"> 
       <p class="site-title"> 
        <img src="/Images/logo.jpg" /></p> 
      </div> 
      <div class="float-right"> 
       <section id="login"> 
         <ul> 
    <li><a href="/Account/Register" id="registerLink">Register</a></li> 
    <li><a href="/Account/Login" id="loginLink">Log in</a></li> 
</ul> 

       </section> 
       <nav> 
        <ul id="menu"> 
         <li><a href="/">Home</a></li> 
         <li><a href="/Upload/UploadFiles">Upload Files</a></li> 
         <li><a href="/Upload/UploadHistory">Upload History</a></li> 
         <li><a href="/Home/Help">Help</a></li> 
         <li><a href="/Admin/Home">Admin</a></li> 
        </ul> 
       </nav> 
      </div> 
     </div> 
    </header> 
    <div id="body"> 

     <section class="content-wrapper main-content clear-fix"> 


<h2>Users</h2> 

<a Confirm="" HttpMethod="" InsertionMode="Replace" LoadingElementDuration="0" LoadingElementId="" OnBegin="" OnComplete="" OnFailure="" OnSuccess="" UpdateTargetId="ajaxtest" Url="" href="/Admin/AjaxTest?Length=5">Ajax Test</a> 

<div id="ajaxtest"></div> 
     </section> 
    </div> 
    <footer> 
     <div class="content-wrapper"> 
      <div class="float-left"> 
       <p>&copy; 2013 - My ASP.NET MVC Application</p> 
      </div> 
     </div> 
    </footer> 

    <script src="/Scripts/jquery-1.7.1.js"></script> 

    <script src="/Scripts/jquery.unobtrusive-ajax.js"></script> 
<script src="/Scripts/jquery.validate.js"></script> 
<script src="/Scripts/jquery.validate.unobtrusive.js"></script> 



</body> 
</html> 

Web配置:

<add key="ClientValidationEnabled" value="true" /> 
<add key="UnobtrusiveJavaScriptEnabled" value="true" /> 

回答

1

您應該使用Ajax.ActionLinkHtml.ActionLink,你也應該確保MicrosoftAjax.js和MicrosoftMvcAjax.js腳本加載中如果您使用的是MVC 2或更高版本(您呈現的HTML不顯示它們),則爲您的頁面。

您正在尋找這樣的輸出:

<a data-ajax="true" data-ajax-method="Get" data-ajax-mode="replace" data-ajax-update="#ajaxtest" href="/Home/About">Ajax Test</a>

+0

我無法相信我錯過了 - 謝謝你,你是一個傳奇! –