js 트리 선택기

코드 블록

<table class="table table-striped table-bordered table-hover">
                    <thead>
                        <tr>
                            <th width="50"align="center"> </th>
                            <th> </th>
                        </tr>
                    </thead>
                    <tbody class="columns">
                        <c:set var="categorys" value ="${categorys}" scope="request" ></c:set>
                        <c:set var="level" value="2" scope="request" /><!--   -->
                        <c:import url="/WEB-INF/views/core/category/select-include.jsp" />
                    </tbody>
                </table>
                <script> $(function(){ $(document).delegate(".pickIDS", "click", function() { var currId = $(this).parents("tr").attr("data-pid"); selectParent(currId); }); }); function selectParent(id){ if($("[data-id='"+id+"']").size()>0){ $("[data-id='"+id+"']").each(function(){ $(this).find(".pickIDS").each(function(){ var parentId = $(this).parents("tr").attr("data-pid"); if(!$(this).is(":checked")) { $(this).prop("checked",true); }else{ return false; } selectParent(parentId); }); }); } } </script>

<c:forEach items="${categorys}" var="category" varStatus="status">
    <tr data-pid="${category.parent.id }" data-id="${category.id }" data-name="${category.name}" data-path='<c:forEach items="${category.path}" var="p" varStatus="status">-${p.id}-</c:forEach>'>
        <td class = "op" width="50"align="center">
            <input type="checkbox" class="pickIDS" value="${category.id }" data-name="${category.name }" />
        </td>
        <td style="padding-left:${level * 20}px;">
            <span class="<c:if test='${category.children.size()>0 }'>arr2</c:if><c:if test='${category.children.size()==0 }'>arr3</c:if>" data-id="${category.id}"><img width='16' height='18' src="<c:url value = "/res/images/blank.gif"/>"/></span>
            <span class="node">
                ${category.name}
            </span>
        </td>
    </tr>
    <c:if test="${category.children!=null }">
        <c:set var="level" value="${level+1 }" scope="request" /><!--   -->
        <c:set var="categorys" value="${category.children}" scope="request" /><!--  ， treeList， request  -->
        <c:import url="/WEB-INF/views/core/category/select-include.jsp" />
    </c:if>
</c:forEach>
<c:set var="level" value="${level - 1}" scope="request" /><!--  ，level-1 -->