Permalink
Browse files

Fix issue #1. Use ko.utils.domData rather than jQuery .data to work p…

…roeprly in IE < 9.
  • Loading branch information...
1 parent 76410a1 commit 2bba5a0f39a2e789a634ed6e404ffb1c92275589 @rniemeyer committed Feb 15, 2012
Showing with 37 additions and 25 deletions.
  1. +16 −10 build/knockout-sortable.js
  2. +2 −2 build/knockout-sortable.min.js
  3. +3 −3 spec/knockout-sortable.spec.js
  4. +16 −10 src/knockout-sortable.js
View
@@ -32,10 +32,15 @@ var prepareTemplateOptions = function(valueAccessor) {
return result;
};
+var itemKey = "ko_sortItem",
+ listKey = "ko_sortList",
+ parentKey = "ko_parentList";
+
//connect items with observableArrays
ko.bindingHandlers.sortable = {
init: function(element, valueAccessor, allBindingsAccessor, data, context) {
- var value = ko.utils.unwrapObservable(valueAccessor()),
+ var $element = $(element),
+ value = ko.utils.unwrapObservable(valueAccessor()),
templateOptions = prepareTemplateOptions(valueAccessor),
sortable = ko.bindingHandlers.sortable,
connectClass = value.connectClass || sortable.connectClass,
@@ -59,17 +64,18 @@ ko.bindingHandlers.sortable = {
}
//attach meta-data
- $(element).data("ko_sortList", templateOptions.foreach);
- $(element).sortable(ko.utils.extend(options, {
+ ko.utils.domData.set(element, listKey, templateOptions.foreach);
+ $element.sortable(ko.utils.extend(options, {
update: function(event, ui) {
var sourceParent, targetParent, targetIndex, arg,
- item = ui.item.data("ko_sortItem");
+ el = ui.item[0],
+ item = ko.utils.domData.get(el, itemKey);
if (item) {
//identify parents
- sourceParent = ui.item.data("ko_parentList");
- targetParent = ui.item.parent().data("ko_sortList");
- targetIndex = ko.utils.arrayIndexOf(ui.item.parent().children(), ui.item[0]);
+ sourceParent = ko.utils.domData.get(el, parentKey);
+ targetParent = ko.utils.domData.get(el.parentNode, listKey);
+ targetIndex = ko.utils.arrayIndexOf(el.parentNode.childNodes, el);
if (beforeMove || afterMove) {
arg = {
@@ -108,7 +114,7 @@ ko.bindingHandlers.sortable = {
//handle disposal
ko.utils.domNodeDisposal.addDisposeCallback(element, function() {
- $(element).sortable("destroy");
+ $element.sortable("destroy");
});
//we are wrapping the template binding
@@ -123,8 +129,8 @@ ko.bindingHandlers.sortable = {
afterRender: function(elements, data) {
ko.utils.arrayForEach(elements, function(element) {
if (element.nodeType === 1) {
- $(element).data("ko_sortItem", data);
- $(element).data("ko_parentList", $(element).parent().data("ko_sortList"));
+ ko.utils.domData.set(element, itemKey, data);
+ ko.utils.domData.set(element, parentKey, ko.utils.domData.get(element.parentNode, listKey));
}
});
},

Some generated files are not rendered by default. Learn more.

Oops, something went wrong.
@@ -102,15 +102,15 @@ describe("knockout-sortable", function(){
});
it("should attach meta-data to the root element indicating the parent observableArray", function() {
- expect(options.root.data("ko_sortList")).toEqual(options.vm.items);
+ expect(ko.utils.domData.get(options.root[0], "ko_sortList")).toEqual(options.vm.items);
});
it("should attach meta-data to child elements indicating their item", function() {
- expect(options.root.children().first().data("ko_sortItem")).toEqual(options.vm.items()[0]);
+ expect(ko.utils.domData.get(options.root.children()[0], "ko_sortItem")).toEqual(options.vm.items()[0]);
});
it("should attach meta-data to child elements indicating their parent observableArray", function() {
- expect(options.root.children().first().data("ko_parentList")).toEqual(options.vm.items);
+ expect(ko.utils.domData.get(options.root.children()[0], "ko_parentList")).toEqual(options.vm.items);
});
});
View
@@ -32,10 +32,15 @@ var prepareTemplateOptions = function(valueAccessor) {
return result;
};
+var itemKey = "ko_sortItem",
+ listKey = "ko_sortList",
+ parentKey = "ko_parentList";
+
//connect items with observableArrays
ko.bindingHandlers.sortable = {
init: function(element, valueAccessor, allBindingsAccessor, data, context) {
- var value = ko.utils.unwrapObservable(valueAccessor()),
+ var $element = $(element),
+ value = ko.utils.unwrapObservable(valueAccessor()),
templateOptions = prepareTemplateOptions(valueAccessor),
sortable = ko.bindingHandlers.sortable,
connectClass = value.connectClass || sortable.connectClass,
@@ -59,17 +64,18 @@ ko.bindingHandlers.sortable = {
}
//attach meta-data
- $(element).data("ko_sortList", templateOptions.foreach);
- $(element).sortable(ko.utils.extend(options, {
+ ko.utils.domData.set(element, listKey, templateOptions.foreach);
+ $element.sortable(ko.utils.extend(options, {
update: function(event, ui) {
var sourceParent, targetParent, targetIndex, arg,
- item = ui.item.data("ko_sortItem");
+ el = ui.item[0],
+ item = ko.utils.domData.get(el, itemKey);
if (item) {
//identify parents
- sourceParent = ui.item.data("ko_parentList");
- targetParent = ui.item.parent().data("ko_sortList");
- targetIndex = ko.utils.arrayIndexOf(ui.item.parent().children(), ui.item[0]);
+ sourceParent = ko.utils.domData.get(el, parentKey);
+ targetParent = ko.utils.domData.get(el.parentNode, listKey);
+ targetIndex = ko.utils.arrayIndexOf(el.parentNode.childNodes, el);
if (beforeMove || afterMove) {
arg = {
@@ -108,7 +114,7 @@ ko.bindingHandlers.sortable = {
//handle disposal
ko.utils.domNodeDisposal.addDisposeCallback(element, function() {
- $(element).sortable("destroy");
+ $element.sortable("destroy");
});
//we are wrapping the template binding
@@ -123,8 +129,8 @@ ko.bindingHandlers.sortable = {
afterRender: function(elements, data) {
ko.utils.arrayForEach(elements, function(element) {
if (element.nodeType === 1) {
- $(element).data("ko_sortItem", data);
- $(element).data("ko_parentList", $(element).parent().data("ko_sortList"));
+ ko.utils.domData.set(element, itemKey, data);
+ ko.utils.domData.set(element, parentKey, ko.utils.domData.get(element.parentNode, listKey));
}
});
},

0 comments on commit 2bba5a0

Please sign in to comment.