لا يمكن سحب وإسقاط العناصر من واحد للفرز إلى آخر داخل فوريش

Question

أنا باستخدام خروج المغلوب / مسج واجهة المستخدم / خروج المغلوب للفرز.

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

يعمل بشكل جيد عندما يتم تحديد الفرز يدويا ولكنه يتوقف عن العمل عندما أقوم بإنشائها داخل ربط فوريش.أي شخص يعرف ما أفعله خطأ?

جافا سكريبت:

  $(function() {
      viewModel = {
        firstItems : ko.observableArray(["Item 1", "Item 2", "Item 3", "Item 4"]),
        secondItems : ko.observableArray(["Item A", "Item B", "Item C", "Item D"]),
        thirdItems : ko.observableArray(["Item W", "Item X", "Item Y", "Item Z"])
      };

      viewModel.allItems = ko.observableArray([viewModel.firstItems, viewModel.secondItems, viewModel.thirdItems]);

      ko.applyBindings(viewModel);
  });

الترميز:

<div id="rows" data-bind="foreach: allItems">

  <ul class="row" data-bind="sortable: $data">
    <li data-bind="text: $data"></li>
  </ul>

</div>

Answer 1

ال sortable يتوقع البرنامج المساعد أن يكون التعامل مع أوبسيرفابلراي.في حالتك ، بناء على الطريقة التي foreach يعمل, $data هو في الواقع غير ملفوف إلى الصفيف الأساسي.

اثنين من الطرق التي يمكن إصلاحه:

1. استخدام $rawData بدلا من $data (http://knockoutjs.com/documentation/binding-context.html) في sortable ملزمة لربط ضد أوبسيرفابلراي بدلا من قيمتها غير ملفوفة.

2. استخدام مجموعة من الكائنات مع خاصية تحتوي على أوبسيرفابلراي مثل:

   viewModel.allItems = ko.observableArray([
       { items: viewModel.firstItems }, 
       { items: viewModel.secondItems },
       { items: viewModel.thirdItems }
   ]);
   

ثم ، ربط ضد items بدلا من $data.