순서를 유지하기 위해 jQuery UI Sortable을 데이터베이스와 어떻게 통합합니까?

jQuery UI 정렬 가능 및 데이터베이스 통합

jQuery UI 정렬 가능을 사용하면 사용자가 요소를 재정렬하고 특정 순서를 유지할 수 있습니다. 이 기능을 데이터베이스와 통합하려면 AJAX 또는 양식 제출과 함께 직렬화 방법을 활용할 수 있습니다.

<code class="javascript">$('#sortable').sortable({
    axis: 'y',
    update: function (event, ui) {
        var data = $(this).sortable('serialize');

        $.ajax({
            data: data,
            type: 'POST',
            url: '/your/url/here'
        });
    }
});</code>

다음과 같은 HTML 구조를 활용하여:

<code class="html"><ul id="sortable">
   <li id="item-1"></li>
   <li id="item-2"></li>
   ...
</ul></code>

직렬화 메소드는 item[]=1&item[]=2와 같은 쿼리 문자열을 생성합니다. 여기서 각 값은 재배열된 요소의 ID를 나타냅니다.

데이터베이스 ID가 요소 ID와 일치한다고 가정하면 다음을 반복할 수 있습니다. 데이터를 게시하고 해당 데이터베이스 레코드를 새로운 위치로 업데이트합니다.

<code class="php">$i = 0;

foreach ($_POST['item'] as $value) {
    $query = "UPDATE [Table] SET [Position] = $i WHERE [EntityId] = $value";
    // Execute the query
    $i++;
}</code>

jQuery UI Sortable을 데이터베이스와 통합하면 객체의 순서를 동적으로 유지하고 정렬 및 지속성을 위한 사용자 친화적인 인터페이스를 제공할 수 있습니다.

위 내용은 순서를 유지하기 위해 jQuery UI Sortable을 데이터베이스와 어떻게 통합합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!