带有枚举列表的JQuery隐藏表

我有以下几个将枚举模型并添加发票和日期。然后，我希望有一张表，其中包含每张发票可折叠的发票行项目。我不知道如何在枚举模型时如何做到这一点，我不知道如何唯一地标识表，然后我不知道如何告诉jquery函数我们需要隐藏哪个表。带有枚举列表的JQuery隐藏表

这里是我现在的代码。我在我想要隐藏的表旁边添加了一条评论。上面有一个锚标签，它调用jQuery隐藏功能的javascript函数是

<table class="themedtable" 
    cellspacing="0"> 
    <tr> 
     <th style="text-align: left"> 
      Invoice 
     </th> 
     <th> 
      Order Date 
     </th> 
    </tr> 
    <% foreach (var item in Model) 
     { %> 
    <tr> 
     <td style="text-align: left"> 
      <strong> 
       <%=Html.Encode(item.Invoice)%></strong> 
     </td> 
     <td> 
      <%=Html.Encode(String.Format("{0:d}",item.invcte))%> 
     </td> 
    </tr> 
    <tr> 
     <td colspan="2"> 
      <a href="javascript:toggletable()">Show/Hide Table</a> 
     </td> 
    </tr> 
    <%if (item.LineItemList.Count > 0) 
    { %> 
    <tr> 
     <td> 
      <table style="margin-left: auto; margin-right: auto; width: 90%" cellspacing="0"> //this is the table i need to id and collapse when the above link is clicked 
       <tr> 
        <th> 
         Part 
        </th> 
        <th> 
         Desc 
        </th> 
        <th> 
         Qty 
        </th> 
        <th> 
         Qty Shipped 
        </th> 
        <th> 
         Status 
        </th> 
       </tr> 
       <%foreach (var lineItem in item.LineItemList) 
        { %> 
       <tr> 
        <td style="width: 10%"> 
         <%=Html.Encode(lineItem.Partno) %> 
        </td> 
        <td style="width: 50%"> 
         <%=Html.Encode(lineItem.Description) %> 
        </td> 
        <td style="width: 10%"> 
         <%=Html.Encode(lineItem.Qty) %> 
        </td> 
        <td style="width: 20%"> 
         <%=Html.Encode(lineItem.QtyShipped) %> 
        </td> 
        <td style="width: 10%"> 
         <%=Html.Encode(lineItem.Status) %> 
        </td> 
       </tr> 
       <%} %> 
      </table> 
     </td> 
    </tr> 
    <%} %> 
    <%} %> 
</table> 

<script type="text/javascript"> 
    function toggletable() { 
     $(//selector).hide(); 
    }

来源

2010-09-16 twal

这是我的两个美分的价值。我想你可能会以一种会让你的生活变得艰难的方式来接近这一点。

我会做的是以下几点。

添加您的发票，如果你喜欢和附加一个点击事件给他们。
点击发票后，使用jQuery执行一个Ajax 回发，获取订单项。
然后，您的ActionResult应该抓取这些订单项，将它们传递给部分视图并将 PartialView返回给客户端。
然后在您的成功jQuery Ajax 方法中，将 div的内容替换为返回的HTML。

这可以节省页面上的大量数据，并且使其看起来非常整齐。

来源

2010-09-16 03:54:51 griegs

我喜欢这个想法，我会与之合作。谢谢！您是否认为有一种方法可以识别div并将其提供给ajax方法，以便它直接显示在点击的发票号码下方，但位于下一个发票号码的上方？ – twal 2010-09-16 14:22:44

是的。但你不需要。您可以使用jQuery将新的HTML直接放置在点击元素之后，从而否定自己找到元素并放置新元素的需要。 jQuery负责所有这些 – griegs 2010-09-16 22:24:37

带有枚举列表的JQuery隐藏表

回答

相关问题