2016-05-17 110 views
1

我在另一个局部视图内部有一个局部视图,当第一次运行应用程序按预期方式加载时,但当您单击以重新加载视图以将模型推入模型时,它会呈现为其自身完全独立的看法,如果它不是一个部分。局部视图不渲染内部视图

我打电话是Ajax表格内,像这样(在动作链接点击后,_GetSearchModal法):

<div id="modelSearch"> 
    <div class="panel panel-default"> 
     <div class="panel-heading"> 
      <h3 class="panel-title"> 
       <i class="fa fa-search"></i> Search by Model/Manufacturer 
      </h3> 
     </div> 
     <div class="panel-body"> 
      @using (Ajax.BeginForm("_GetSearch", "Home", new AjaxOptions() {UpdateTargetId = "modelSearch"})) 
      { 
       @Html.AntiForgeryToken() 
       <div class="input-group"> 
        @Html.TextBox("search", null, new {id = "name", @class = "form-control", placeholder = "Please enter a manufacturer or model"}) 
        <span class="input-group-btn"> 
         <button id="search" class="btn btn-default" type="submit"><i class="fa fa-search"></i></button> 
        </span> 
       </div> 
       if (Model != null) 
       { 
        <div id="searchResults" class="fade-in two"> 
         @foreach (var s in Model) 
         { 
          <div class="result"> 
           @switch (s.ResultType) 
           { 
            case "Man": 
             <a href="#">@s.Manufacturer</a> 
             break; 
            case "Mod": 
             @Html.ActionLink(s.Manufacturer + Html.Raw(s.Model), "_GetSearchModal", "Home", new {id = s.MachineId}, new {toggle = "modal", data_target = "#MachineModal"}) 
             <img src="~/Images/General/Tier/@(s.TierId).png" alt="Tier @s.TierId"/> 
             break; 
           } 

          </div> 

         } 
        </div> 
       } 
      } 
     </div> 
    </div> 
</div> 

<!-- Product Modal --> 
<div class="modal fade" id="MachineModal" tabindex="-1" role="dialog" aria-labelledby="MachineModalLabel"> 
    @Html.Partial("_SearchModal", new MachineModal()) 
</div> 

和视图本身应该加载不同的视图模型(MachineModal):

@model SpecCheck.Portals.Web.UI.ViewModels.MachineModal 

@if (Model != null) 
{ 

     <div class="modal-dialog" role="document"> 
      <div class="modal-content"> 
       <div class="modal-header"> 
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button> 
        <h4 class="modal-title" id="MachineModalLabel">@Model.Manufacturer @Model.Model</h4> 
       </div> 
       <div class="modal-body"> 
        <div class="row"> 
         <div class="col-md-6"> 
          <img src="~/Images/@Model.Manufacturer/logo.png" alt="@Model.Manufacturer" /><br /> 
          <a href="#" type="button" class="btn button">Wiki</a> 
         </div> 
         <div class="col-md-6"> 
          @Model.Catagory1 | @Model.Category2<br /><br /> 
          <span class="modal-em">Region: </span> @Model.Region<br /> 
          <span class="modal-em">Status: </span>@Model.Status<br /> 
          <span class="modal-em">Spec Date: </span>@Model.SpecDate 
         </div> 
        </div> 
       </div> 
       <div class="modal-footer"> 
        <a href="#" type="button" class="btn button">View</a> 
        <a href="#" type="button" class="btn button">Quick Compare</a> 
        <a href="#" type="button" class="btn button">Compare</a> 
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> 
       </div> 
      </div> 
     </div> 
} 

而在 “家庭控制器” 做这个动作是:

public ActionResult _GetSearchModal(string machineId) 
{ 
    using (var db = new SpecCheckDbContext()) 
    { 
     MachineModal machine = new MachineModal(); 
     var searchHelper = new SearchHelper(db); 

     //Get Machine Details 
     var dbResults = searchHelper.SearchModal(Convert.ToInt32(machineId)); 

     machine.Model = dbResults.Model; 
     machine.Catagory1 = dbResults.Catagory1; 
     machine.Category2 = dbResults.Category2; 
     machine.Manufacturer = dbResults.Manufacturer; 
     machine.Region = dbResults.Region; 
     machine.SpecDate = dbResults.SpecDate; 
     machine.Status = dbResults.Status; 
     machine.MachineId = dbResults.MachineId; 
     machine.ManufacturerId = dbResults.ManufacturerId; 

     var model = machine; 

     return PartialView("_SearchModal", model); 
    } 
} 

第一我检查过的东西是脚本,当布局页面加载时它们都处于适当的位置,所以它不是脚本问题。不知道该怎么改变,甚至尝试在这一点上,所以任何建议欢迎。

+1

如果它在新视图中呈现你的部分,这意味着你没有包含正确的脚本('jquery-unobtrusive-ajax.js'),而你正在进行提交,而不是ajax提交。但它是'UpdateTargetId =“modelSearch”'或者它应该是'UpdateTargetId =“MachineModal”'? –

回答

3

在AJAX形式:

_GetSearch => _GetSearchModal(name of the action)

尝试返回machine的局部视图?也许看到在视图层次结构中,是否有第二个_SearchModal局部视图,返回?