jQuery لايف وفرز

Question

أحاول تنفيذ السحب والإفلات حتى أتمكن من فرز قوائم البيانات وتحديث قاعدة البيانات مع المواقف ذات الصلة.

لدي مثال عامي ولكن عندما أحاول استخدام نفس الرمز في القوائم التي يتم إحضارها عبر AJAX، فإن الحدث هو ملزم ولكن لا يتم تشغيل أي من أساليبها وعناصر لا تبدا مباددا، (تبادلا مرة أخرى عندما تتركها الفأر)

هنا هو بلدي html

<ul class='sortable'>
    <li>
        <ul>
            <li>Data</li>
            <li>Data2</li>
        </ul>
   </li>
   <li>
        <ul>
            <li>Data3</li>
            <li>Data4</li>
        </ul>
   </li>
</ul>

ثم تبدو جافا سكريبت هذه. أريد فقط أن يتم تبديل ul الداخلي. أي القوائم التي تحتوي على data data2 إلخ.

$(document).ready(function()
{
    //$(".sortable").disableSelection();
    $(".sortable").live("dblclick", function()
    {
        $(".sortable").sortable({
            update : function()
            {
                alert("update");
            }
        });
    });
});

باستخدام حدث مثل انقر نقرا مزدوجا أو انقر فوق الطريقة الوحيدة التي يمكنني الحصول على الحدث للربط على الإطلاق. باستخدام Sortable لم يعمل.

هنا هو الرمز الذي استخدمته لمحاولة ربط العنصر وكذلك العينة أعلاه

$(document).ready(function()
{
    $(".sortable").live("sortable", function()
    {
        $(".sortable").sortable({
            update : function()
            {
                alert("update");
            }
        });
    });
});

لقد جربت أيضا الرمز أعلاه دون ملفوفة () ملفوفة ولكن هذا لم يعمل أيضا.

هنا هو الرمز الذي يقوم بتحميل القائمة من الخادم،

$(".myLink").live("click", function()
{
    var id   = $(this).attr("id");
    var url = base_url + "admin/controller/function/" + id;

    showList(url);

    return false;
});


//loads data into the form div
function showList(url)
{
    var arr = new Array();
    $.post(url, arr, function(data)
    {
        $("#form").html(data);

    }, "text");
}

أي اقتراحات أو مؤشرات في الاتجاه الصحيح سيساعد.

شكرا

Answer 1

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

أنا الآن استخدم العرض: مضمن إلى نمط القائمة أفقيا. آمل أن يساعد ذلك شخصا ما لأنه استغرق الأمر ساعات العمل بها.

شكرا للمساعدة. بن

Answer 2

تحديث

تغيير خط رد AJAX الخاص بك من $("#form").html(data); الى هذا:

$("#form").html(data).find('.sortable').sortable(originalOptions);

وتغيير الأصلي الخاص بك sortable() أمر (الذي أفترض أنه في مكان آخر) لشيء مثل هذا:

var originalOptions = { update: function(){ alert('click');}  };
$(".sortable").sortable( originalOptions );

الشيء المهم هو التأكد originalOptions متاح للاستخدام في الخاص بك showList وظيفة.

الإجابة الأصلية

تحتاج فقط إلى استخدام refresh عند تحديث القائمة. لذلك دعونا نقول أن لديك هذا $.post الشفرة:

$.post('/url', { new_positions: whatever }, function(data){
  // data = a bunch of 'lis' but no 'ul'
  $('.sortable').html(data).sortable('refresh');
}, 'html');

هذا يغير القديم li البنود للآخرين، و refresh يجب أن تقبل وقبول العناصر الجديدة.