jQuery UI Sortable وتكامل قاعدة البيانات

مع jQuery UI Sortable، يمكنك تمكين المستخدمين من إعادة ترتيب العناصر والحفاظ على ترتيب معين. لدمج هذه الوظيفة مع قاعدة البيانات الخاصة بك، يمكنك الاستفادة من طريقة التسلسل بالتزامن مع AJAX أو إرسال النموذج.

$('#sortable').sortable({
    axis: 'y',
    update: function (event, ui) {
        var data = $(this).sortable('serialize');

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

من خلال استخدام بنية HTML مثل:

   

   

   ...

ستعمل طريقة التسلسل على إنشاء سلسلة استعلام مثل: item[]=1&item[]=2، حيث تمثل كل قيمة معرف العنصر المعاد ترتيبه.

بافتراض قاعدة البيانات الخاصة بك تتطابق المعرفات مع معرفات العناصر، ويمكنك بعد ذلك تكرار البيانات المنشورة وتحديث سجلات قاعدة البيانات المقابلة بمواضعها الجديدة.

$i = 0;

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

يسمح لك دمج jQuery UI Sortable مع قاعدة البيانات بالحفاظ على ترتيب الكائنات ديناميكيًا، مما يوفر واجهة سهلة الاستخدام للترتيب والثبات.