表格內的手風琴行

我正在使用Twitter Bootstrap。目前我正在研究Master Details看起來很相似的表格，我打算在每個表格的行中放置一個手風琴，如果展開，部分視圖將被重新加載並顯示。表格內的手風琴行

不知怎的，它不能按預期工作，但如果我將它更改爲Modal，則部分視圖將完美加載。

這是控制器，用於處理和返回值：

public ActionResult Index(int id,int? page) 
    { 
     List<CustomerProduct> customerProducts = 
     (from c in RepositoryProduct.Reload(id) 
     select c).ToList<CustomerProduct>(); 
     return PartialView("_CustomerProducts", customerProducts); 
    }

，這是在視圖中的表：

<table id="tbl" class="table table-condensed" style="border-collapse:collapse;"> 
      <thead> 
       <tr>  
         <th> 
          @Html.ActionLink("Customer Name", "Index", new { sortOrder = ViewBag.NameSortParm, currentFilter = ViewBag.CurrentFilter }) 
         </th> 

         <th> 
          @Html.DisplayNameFor(model => model.First().CustLocalName) 
         </th> 

         <th>        
          @Html.ActionLink("Country", "Index", new { sortOrder = ViewBag.CountrySortParm, currentFilter = ViewBag.CurrentFilter }) 
         </th> 

         <th> 
          @Html.DisplayNameFor(model => model.First().City) 
         </th> 

        </tr> 
      </thead> 

      <tbody> 
       @foreach (var item in Model) 
       { 
        <tr data-toggle="collapse"> 

         <td style="display:none;"> 
          @Html.DisplayFor(modelItem => item.CustID) 
         </td> 

         <td> 
          @Html.DisplayFor(modelItem => item.CustName) 
         </td> 

         <td> 
          @Html.DisplayFor(modelItem => item.CustLocalName) 
         </td> 

         <td> 
          @Html.DisplayFor(modelItem => item.Country.CountryName) 
         </td> 

         <td> 
          @Html.DisplayFor(modelItem => item.City) 
         </td> 

         <td> 
          <a class="btn btn-small btn-info" type="button" href="@Url.Action("Index", "CustomerProduct", new { id = item.CustID })" data-toggle="collapse" data-target="#@item.CustID" >Products</a>        
         </td> 

        </tr> 

        <tr> 

         <td colspan="6" class="hiddenRow"> 
          <div id="@item.CustID" class="accordian-body collapse" tabindex="-1"> 
           <div class="accordion-header"> 

            <label> 
             <strong>@item.CustName product(s)</strong> 
            </label> 
           </div> 
           <div class="accordion-body">TEST</div> 
          </div> 
         </td> 

        </tr> 
       } 

      </tbody> 
    </table>

這是代碼的一部分，調用控制器指數函數：

<a class="btn btn-small btn-info" type="button" href="@Url.Action("Index", "CustomerProduct", new { id = item.CustID })" data-toggle="collapse" data-target="#@item.CustID" >Products</a>

其實我想加載partialview（_CustomerProduct）div class =「accordion-body」正如我在div class =「modal-body」但沒有成功。請問我是否有可能這樣做，如果是的話，我可以知道嗎？

任何幫助將不勝感激。

來源

2013-07-16 anevil

，我得到的視圖的工作，我用

<td colspan="6" class="hiddenRow"> 
          <div id="@item.CustID" class="accordian-body collapse" tabindex="-1"> 
           <div class="accordion-header"> 

            <label> 
             <strong>@item.CustName product(s)</strong> 
            </label> 
           </div> 
           <div class="accordion-body"> 
            @Html.Partial("_CustomerProduct") 
           </div> 
          </div> 
         </td>

來源

2013-10-14 11:29:13 yrthilian

表格內的手風琴行

回答

相關問題