JQuery可折叠表不工作

我在我的JQuery代码中需要一些帮助我似乎无法理解我出错的地方。这是一个简单的“家长”和“儿童”式可折叠的桌子。所以首先所有的'儿童'被隐藏，如果你点击一个父它显示全部是儿童。我的代码存在的问题是当我点击父母它的所有孩子都显示在所有其他父母中。感谢JQuery可折叠表不工作

$(document).ready(function() { 
$("#report tr:odd").addClass("odd"); 
$("#report tr:not(.odd)").hide(); 
$("#report tr:first-child").show(); 

$('location.href').click(function() { 
    $.ajax({ 
    type : 'GET', 
    url : 'Test', 
    data : '${cat.categoryId}', 
success : function(response) { 
    $('ul').html(response); 
    $("#report tr.odd").next("tr").toggle(); 
    } 
    }); 
    }); 
});

JSP

<c:if test="${!empty categoryList}"> 
<table id="report"> 
    <tr> 
     <th>Category Name</th> 
    </tr> 
     <c:forEach items="${categoryList}" var="cat"> 
     <tr onclick="location.href='${cat.categoryId}'" > 
      <td>${cat.categoryName}</td> 
      <td><div class="arrow"></div></td> 
     <tr> 
      <td colspan="5"> 
      <c:forEach items="${prodList}" var="prod"> 
      <ul> 
       <li>${prod.productName}</li> 
      </ul> 
      </c:forEach> 
     </tr> 
    </c:forEach> 
</table> 
</c:if>

控制器

@RequestMapping(value="{Id}", method = RequestMethod.GET) 
public String showProductByCatId(@PathVariable("Id") Integer Id, Model model){ 
    List<Product> prod = purchaseOrderService.listProductsByCatId(Id); 
    model.addAttribute("prodList", prod); 
    model.addAttribute("categoryList",purchaseOrderService.listCategory()); 
    return "Test"; 
}

来源

2012-12-29 Zed420

的#report tr.odd在

$("#report tr.odd").next("tr").toggle();

将匹配所有奇数行，您需要选择只有CL icked一行像这样

$('#report tr.odd').click(function() { 
     var child = $(this).next('tr'); 

     $.ajax({ 
      type : 'GET', 
      url : 'Test', 
      data : '${cat.categoryId}', 
      success : function(response) { 
       child.find('ul').html(response); 
       child.toggle(); 
      } 
     }); 
});

编辑： 您需要选择合适的<ul>还有，我已经更新上面的代码。

来源

2012-12-29 22:31:16 wazz3r

感谢您的回复，现在没有切换，所有的孩子都隐藏了。 – Zed420

我真的很抱歉wazz3r这已经回到了原来的问题，显示在所有父母点击父母的孩子。 – Zed420

我不知道你在做什么。在JSP文件中，您已经将数据写入行，为什么首先需要ajax调用？ – wazz3r

JQuery可折叠表不工作

回答

相关问题