From 4b9fc79dd90aa72454735635f266334075098e70 Mon Sep 17 00:00:00 2001 From: Sebastian Rosengren Date: Sat, 14 Nov 2015 23:13:19 +0100 Subject: [PATCH] Added knockout-sortable example/test --- knockout/example.html | 86 ++++++++++++++++++++++++++++++++++--------- 1 file changed, 69 insertions(+), 17 deletions(-) diff --git a/knockout/example.html b/knockout/example.html index ae90b21..6dac803 100644 --- a/knockout/example.html +++ b/knockout/example.html @@ -17,36 +17,82 @@ .col-1_2 { width: 50%; } + + .mirror { + color: #ccc; + }
-

Sortable observable

-
    -
  • -
+
+
+

Sortable observable

+
    +
  • +
+
+
+

Sortable observable mirrored

+
    +
  • +
+
+
+
-

Sortable observable mirrored

-
    -
  • -
+
+
+

Sortable computed

+
    +
  • +
+
+
+

Sortable computed mirrored

+
    +
  • +
+
+
-

Sortable computed

-
    -
  • -
+
+
+

Draggable observable

+
    +
  • +
+
+
+

Draggable observable mirrored

+
    +
  • +
+
+
+
-

Sortable computed mirrored

-
    -
  • -
+
+
+

Draggable computed

+
    +
  • +
+
+
+

Draggable computed mirrored

+
    +
  • +
+
+
@@ -58,11 +104,17 @@ var sortableComputedItems = [{ name: 'Sortable computed 1' }, { name: 'Sortable computed 2' }, { name: 'Sortable computed 3' }]; var sortableObservableItems = [{ name: 'Sortable observable 1' }, { name: 'Sortable observable 2' }, { name: 'Sortable observable 3' }]; + var draggableComputedItems = [{ name: 'Draggable computed 1' }, { name: 'Draggable computed 2' }, { name: 'Draggable computed 3' }]; + var draggableObservableItems = [{ name: 'Draggable observable 1' }, { name: 'Draggable observable 2' }, { name: 'Draggable observable 3' }]; + var vm = { underlayingSortableComputedItems: ko.observableArray(sortableComputedItems), - sortableObservableItems: ko.observableArray(sortableObservableItems) + sortableObservableItems: ko.observableArray(sortableObservableItems), + underlayingDraggableComputedItems: ko.observableArray(draggableComputedItems), + draggableObservableItems: ko.observableArray(draggableObservableItems) } vm.sortableComputedItems = ko.computed(function () { return vm.underlayingSortableComputedItems(); }); + vm.draggableComputedItems = ko.computed(function () { return vm.underlayingDraggableComputedItems(); }); ko.applyBindings(vm);