2012-07-20 101 views
1

我知道前面兩個問題,它們討論嵌套部分視圖,但解決方案不適用於我的設計(這可能不是最好的,但我是不確定如何調整它)。MVC3嵌套部分視圖調用Ajax.ActionLink

背景

我收集來自用戶的問卷答案,並將其存儲在SQL Server爲XML文件上。

我有一個部分視圖,它加載了一個給定用戶的所有響應的表格,這個部分視圖填充了類似響應日期,xml響應文檔的鏈接,調查問卷名稱,xml問卷文檔的鏈接(問卷info從另一個表中拉出來)以及一個Ajax ActionLink,它將重定向到分析兩個相關xml文檔以在第二個局部視圖內打印出問題和答案列表(即將響應可視化爲人類可讀)的操作。

第一個局部視圖在表格下方包含一個div,我希望用第二個局部視圖填充Ajax.ActionLink。

問題

的回答正確呈現然而局部視圖被加載到一個全新的頁面,而沒有任何樣式。

其他辦法解決這一嵌套問題使用的RenderPartial(),但是我用回PartialView()

代碼

第一部分視圖:

 <table> 
     <thead> 
     <tr><th>headers with other info</th> 
      <th>Display(/th> 
     <tr> 
     </thead> 
     <tbody> 
     <tr><td>cells with other info</td> 
      <td>@Ajax.ActionLink("View", "DisplayResponse","HealthStatus", new { respID = item.UniqueID,qVersion=item.QuestionnaireVersion, qname = item.QuestionnaireName }, new AjaxOptions { UpdateTargetId = "responseDisp" })</td> 
     </tbody> 
     </table> 
<div id="responseDisp"></div> <--- **This is the div I wish to populate, does anyone know why it's not working?** 

DisplayResponse行動(不解析xml文檔的邏輯)

public ActionResult DisplayResponse(Guid respID, int qVersion, String qname) { 
     var allResponses = ZData.Responses; 
     var response = (from r in allResponses 
         where r.UniqueID == respID 
         select r 
          ).First(); 
     //geting an XML questionnaire document 
     var questionnaireDetails = ZodiacData.Questionnaires; 
     var questionnaire = (from q in questionnaireDetails 
          where q.Name == qname && q.Version == qVersion 
          select q 
          ).First(); 
     //creating XMLDocument to read the questionnaire 
     XmlDocument xqdoc = new XmlDocument(); 
     xqdoc.LoadXml(questionnaire.Xml); 
     XmlElement qroot = xqdoc.DocumentElement; 
     ViewBag.qroot = qroot; 
     XmlDocument xrdoc = new XmlDocument(); 
     xrdoc.LoadXml(response.Raw); 
     XmlElement rroot = xrdoc.DocumentElement; 
     ViewBag.rroot = rroot; 

     return PartialView("_PrintedResponse"); 
    } 

我會很感激任何幫助!

+1

檢查'jquery.unobtrusive-ajax.js'文件包含在你的觀點,因爲這個文件中包含有需要的js函數'@ Ajax.ActionLink' – nemesv 2012-07-20 12:53:01

+0

貴部分有型號?我沒有看到你傳遞任何東西給部分。 – anAgent 2012-07-20 12:57:54

+0

@nemesv:謝謝!就是這樣,多麼尷尬。如果您想將其作爲答案,我會接受它。 – Nieszka 2012-07-20 13:05:00

回答

2

在MVC3中,@AJax.助手正在呈現常規forma標籤,並帶有一些額外的data-屬性。爲了使魔術工作,需要一些Javascript,它將使用這個生成的data-屬性來進行必要的jQuery ajax調用。

這些JS功能是居住在jquery.unobtrusive-ajax.js所以這行添加到您的佈局或視圖,它應該工作:

<script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.js")" 
     type="text/javascript"></script> 
1

首先,正如上面提到的,你必須對jquery.unobtrusive-參考ajax.js文件,因爲這會讓你的事情「正確地」連接起來。

這個答案也迴應了你對你的問題的評論,關於你如何將你的模型傳遞給你的觀點。實際上,通過在模型中使用ViewBag,可以讓事情變得更加複雜。

通過在模型中使用ViewBag,您將更難找到/修復/解決錯字的問題以及Razor助手的強大功能。 ViewBag是一個動態對象,沒有編譯時類型檢查。你不需要施放你的對象(少代碼)。

優選(和最佳實踐)是掛鉤東西像這樣:

1)你的控制器包含的ViewModels(強類型),其被傳遞到的ViewModels

控制器

public ActionResult Something() { 
     return View(); 
    } 

    public ActionResult UserView() { 
     UserViewModel mdoel = new UserViewModel { 
      Email = "[email protected]", 
      FirstName = "Your", 
      SStatuses = new List<SStatus>{ 
       new SStatus { 
        ID = 0 
       } 
      } 
     }; 
     return PartialView("_SomethingPartial", mdoel); 
    } 

指數( 「東西」 視圖)

@{ 
    ViewBag.Title = "Something"; 
} 

<script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.js")" type="text/javascript"></script> 
<h2>Something</h2> 
@Ajax.ActionLink("Ajax Click", "UserView", new AjaxOptions { UpdateTargetId = "MyDivContainer", InsertionMode = InsertionMode.Replace }) 
<div id="MyDivContainer"> 
<!-- my content should be here --> 
</div> 

管窺

@model StackModels.UserViewModel 
<div class="par"> 
    @Html.LabelFor(m => m.FirstName) 
    <div class="field"> 
     @Html.TextBoxFor(m => m.FirstName) 
     @Html.ValidationMessageFor(m => m.FirstName) 
    </div> 
</div> 
+0

這極大地幫助我創建一個視圖模型,我希望我可以做的不僅僅是上調它,而且我不能真正將它標記爲正確的答案。非常感謝你讓我的代碼更優雅! – Nieszka 2012-07-23 10:15:10

+0

很高興能幫到你! – anAgent 2012-07-23 10:54:59