2016-10-13 15 views
0

メインビューで部分ビューを呼び出しています。通常の使用には問題ありません。ポストバックでは、パーシャルビューコントローラのビットは決してトリガされず、パーシャルビューは表示されません。ポストバックがトリガーされても部分ビューがレンダリングされることを確認するために使用できるオプションは何ですか?メインビューに部分ビューが表示されない

モデル:

public class ReportSummary 
{ 
    public int PayrollNumber { get; set; } 
    public string Name { get; set; } 
    public string ConflictInterest { get; set; } 
    public string SummaryConflictInterest { get; set; } 
    public string FinancialInterest { get; set; } 
    public string SummaryFinancialInterest { get; set; } 
    public string GiftInterest { get; set; } 
    public string SummaryGiftInterest { get; set; } 
    public string Combined { get; set; } 
    public string SummaryCombined { get; set; } 
} 

コントローラー:

メイン:

public ActionResult CoiReporting() 
{ 
... 
    var model = new ReportParamters(); 
     model.Year = DateTime.Today.Year-1; 
     model.SelectedTab = "0"; 
... 
     return View(model); 
} 
[HttpPost] 
[ActionName("CoiReporting")] 
public ActionResult CoiReportingConfrim(string ViewReport, ReportParamters model) 
{ 
... 
    switch (model.SelectedTab) 
    { 
    ... 
    } 

    return View(model); 
} 

部分:

public ActionResult _ReportCriteria(int Year=0, int ReportType=0, int Person=0, int Group=0, int Division=0, int Department=0, int Section=0, string SelectedTab="X") 
{ 
    ... 
     var model = new ReportParamters(); 
     model.Year = Year; 
     model.ReportType = ReportType; 
     model.Person = Person; 
     model.Group = Group; 
     model.Division = Division; 
     model.Department = Department; 
     model.Section = Section; 
     model.SelectedTab = SelectedTab; 
     return PartialView(model); 
} 

再生回数:一部

メイン

@model ConflictOfInterest.Models.ReportParamters 
@using (Html.BeginForm("CoiReporting", "Home", FormMethod.Post, new { enctype = "multipart/form-data" })) 
{ 
    @Html.HiddenFor(model => model.SelectedTab) 
    @Html.HiddenFor(model => model.Year) 
    <div id="tabs"> 
     <ul> 
      <li><a href="#tabs-1" data-toggle="tab">Summary</a></li> 
      <li><a href="#tabs-2" data-toggle="tab">Statistics</a></li> 
      <li><a href="#tabs-3" data-toggle="tab">Statistics with Person Detail</a></li> 
     </ul> 
     <div id="tabs-1"> 
      <table border="0" cellpadding="0" cellspacing="0"> 
       <tr> 
        <td>Show the detail captered by direct reports.</td> 
       </tr> 
      </table> 
     </div> 
     <div id="tabs-2"> 
     </div> 
     <div id="tabs-3"> 
     </div> 
    </div> 
    <input type="submit" name="ViewReport" id="ViewReport" value="View Report" class="SaveForm" /> 
    <script type="text/javascript"> 
     $(function() { 
      var sPath = ""; 
      var sParam = ""; 
      $("#tabs").tabs({ 
       activate: function (event, ui) { 
        var selectedTab = $('#tabs').tabs('option', 'active'); 
        $("#SelectedTab").val(selectedTab); 
        console.log("Tab selected: " + selectedTab); 

        var sUrl = "@Url.Action("_ReportCriteria", Model)"; 
....  
        $('.ui-tabs-panel').empty(); 
        sParam = aParam.join("&") 
        ui.newPanel.load(sPath + sParam); 
       }, 
       active: $("#SelectedTab").val() 
      }); 

     }); 
     $('#tabs').click('tabsselect', function (event, ui) { 
      var selectedTab = $("#tabs").tabs("option", "active"); 
      $("#SelectedTab").val(selectedTab); 
     }); 
    </script> 
} 

@model ConflictOfInterest.Models.ReportParamters 
@{ 
if (Model.SelectedTab != "0") 
{ 
    <table border="0" cellpadding="0" cellspacing="0"> 
     @{ 
      if (Model.SelectedTab == "1") 
      { 
       <tr> 
        <td style="font-weight:bolder">@Html.Label("Year", "Year:")</td> 
        <td>@Html.DropDownListFor(model => model.Year, Enumerable.Empty<SelectListItem>(), (DateTime.Today.Year - 1).ToString(), new { @style = "width:200px;" }) 

        </td> 
        <td style="font-weight:bolder">@Html.Label("ReportType", "Report Type:")</td> 
        <td>@Html.DropDownListFor(model => model.ReportType, new SelectList(ViewBag.ReportType, "value", "Text"), new { @style = "width:200px;" })</td> 
        <td style="font-weight:bolder"> 
         @Html.Label("Person", "Person:") 
         @Html.Label("Group", "Group:") 
        </td> 
        <td> 
         @Html.DropDownListFor(model => model.Group, new SelectList(ViewBag.GroupList, "value", "Text"), new { @style = "width:200px;" }) 
         @Html.DropDownListFor(model => model.Person, Enumerable.Empty<SelectListItem>(), "All", new { @style = "width:200px;" })<br /> 
         @Html.TextBox("sPerson") 
         <input type="button" id="bPerson" value="Search" /> 
        </td> 
       </tr> 
      } 
      /*else 
      { 
       <tr> 
        <td colspan="6"></td> 
       </tr> 
      }*/ 
     } 
     <tr> 
      <td style="font-weight:bolder">@Html.Label("Division", "Division:")</td> 
      <td>@Html.DropDownListFor(model => model.Division, new SelectList(ViewBag.Division, "value", "Text"), new { @style = "width:200px;" })</td> 
      <td style="font-weight:bolder">@Html.Label("Department", "Department:")</td> 
      <td>@Html.DropDownListFor(model => model.Department, Enumerable.Empty<SelectListItem>(), "All", new { @style = "width:200px;" })</td> 
      <td style="font-weight:bolder">@Html.Label("Section", "Section:")</td> 
      <td>@Html.DropDownListFor(model => model.Section, Enumerable.Empty<SelectListItem>(), "All", new { @style = "width:200px;" })</td> 
     </tr> 
     <tr> 
      <td colspan="6"></td> 
     </tr> 
    </table> 
} 
else 
{ 
    <table border="0" cellpadding="0" cellspacing="0"> 
     <tr> 
      <td>Show the detail captered by direct reports.</td> 
     </tr> 
    </table> 
} 
} 
+1

あなたの部分端面での負荷の違いの

テイク・ノートでは、JavaScriptでレンダリングされています。 @ Html.Partial()を使って部分的なビューをレンダリングしてみてください。 –

+0

@ marc-Lyonはい、そうです。選択したタブに基づいて同じ部分ビューを複数回使用しています。どのようにそれを使用する方法についていくつかの方向を提供することは可能でしょうか? –

+0

これは、ポストバックがあったかどうかとは関係ありません。部分ビューをレンダリングするアクションがJavaScriptによって呼び出されているため、何らかの理由でポストバック後にJavaScriptコードが実行されていません。 * that *のソースを見つけて、あなたの解決策を得てください。 –

答えて

0

タブがアクティブになったときjqueryのタブのactivateイベントがトリガされます(選択された)。 ポストバック時に同じアクションが行われるようにするには、createイベントも使用する必要があります。

  create: function (event, ui) { 
       //event.preventDefault(); 
       var selectedTab = $('#tabs').tabs('option', 'active'); 
       $("#SelectedTab").val(selectedTab); 
       console.log("Tab selected: " + selectedTab); 

       var sUrl = "@Url.Action("_ReportCriteria", Model)"; 
       //console.log("Start Url: " + sUrl); 
       sPath = sUrl.substring(0, sUrl.lastIndexOf("?") + 1); 
       //console.log("Path: "+sPath); 
       //console.log("Parameters:"+sUrl.substring(sUrl.lastIndexOf("?") + 1, sUrl.length)); 
       sParam = sUrl.substring(sUrl.lastIndexOf("?") + 1, sUrl.length) 

       var aParam = sParam.split("&amp;"); 
       for (var i = 0; i < aParam.length; i++) { 
        var aParama = aParam[i].split("="); 
        switch (i) { 
         case 7: 
          aParama[1] = selectedTab; 
          break; 
        } 
        aParam[i] = aParama.join("="); 
       } 

       $('.ui-tabs-panel').empty(); 
       sParam = aParam.join("&") 
       ui.panel.load(sPath + sParam); 
      }, 
関連する問題