구글링을 통해 드래그앤드롭을 우연히 찾아내어서 홈페이지에 적용하면 좋을꺼같아 구현중입니다.

그런데 문제점이 발견이 되어서 고수분들이나 sir유저분들에게 조금이나마 도움을 받기 위해 질문을 드립니다.

<script>

    $( document ).ready(function() {

        $( "#sortable" ).sortable({

            update: function( event, ui ){

                var arr = [];

                $('div#sortable > a').each(function(){

                    arr.push( $(this).text() );

                });

                var result = arr.join(', ');

                $('#input-tag').val( result );

            }

        });

        $( "#sortable" ).sortable();

        $( "#sortable" ).disableSelection();

        $( "#sortable" ).bind( "sortstop", function(event, ui) {

        });

    });

    </script>

위의 소스는 해당 드래그앤드롭을 가능하게 해주는 스크립트와 옮겼던 데이터들을 표시할수 있게 해주는 스크립트입니다.

밑의 소스는 for문을 사용하여 해당 게시글을 출력할수 있게하는 소스입니다.

$sql = " select * from g5s_BigDiv order by BigDivOrder asc ";

    $result = sql_query($sql);    

    // 해당 옮겨지는 데이터 값 표시

          echo  <div id = 'sortable' data-role='listview' data-inset = 'true' data-theme='d'>

    for($i=0; $row=sql_fetch_array($result); $i++) {  //while을 사용해도 상관없음.

    echo "<a>".$row['BigDivName']."</a></div>";

    $sql2 = "select * from g5s_MediumDiv where BigDivNo = '{$row['BigDivNo']}' order by MediumDivOrder asc";

    $result2 = sql_query($sql2);

    for($j=0; $row2=sql_fetch_array($result2); $j++){

     echo "<a>".$row2['MediumDivName']."</a>"; 

    }

    }

          echo  </div> 

게시글이 2단 분류라 for문을 2개를 사용하여서 출력을 했는데요.

여기서 문제가 Main으로 치는 1단계 게시글을 이동할 시에 

1단계에 해당하는 2단계 애들이 같이 이동이 되어야하는 1단계애들만 이동이 되버리네요 ㅜㅜ

1단계를 옮길시에 1단계에 포함되어있는 2단계애들을 같이 옮길수 있는 방법이 없을까요 ?