diff --git a/README.md b/README.md index 956564bae..bd5c9527e 100644 --- a/README.md +++ b/README.md @@ -427,6 +427,142 @@ Sortable.create(list, { --- +#### `recursionTags` option +This option controls how the `getHierarchy` method descends the +hierarchical structure. It must be set to an array of element tag names. +The tag names of elements within list items are compared to this array +and, if found, will result in `getHierarchy` descending +into it as a sublist. (default `[ "UL", "OL" ]`) + +With the default settings +```html + +``` + +`getHierarchy` will generate the expected structure of three elements with the second +and third elements having two children each. + +To convert this over to using `
` elements instead use +```js +Sortable.create(el, { + recursionTags: [ "DIV" ] +}); +``` + +```html +
+
list item one text
+
list item two text +
+
sublist item one text
+
sublist item two text
+
+
+
list item three text +
+
sublist item three text
+
sublist item four text
+
+
+
+``` +`getHierarchy` will generate the same structure of three elements with the second +and third elements having two children each. + + +--- + + +#### `recursionClasses` option +This option is similar to `recursionTags` except it looks at the classes +set on the elements within list items. +```js +Sortable.create(el, { + recursionTags: [ ] + recursionClasses: [ "choose-me" ] +}); +``` + +```html + +``` +`getHierarchy` will generate the expected structure of three elements with only +the third element having two children. +Note that the `recursionTag` option must be cleared to an +empty array to prevent recursion on the matching tag names. + + +--- + + +#### `recursionIds` option +This option is similar to `recursionTags` and `recursionClasses` +except it looks at the id attribute set on the elements within list items. + +```js +Sortable.create(el, { + recursionIds: [ "chosen1", "chosen2" ] +}); +``` + +```html +
+
list item one text
+
list item two text +
+
sublist item one text
+
sublist item two text
+
+
+
list item three text +
+
sublist item three text
+
sublist item four text
+
+
+
+``` +`getHierarchy` will generate the expected structure of three elements with +the second and third elements having two children each. +Note that the `recursionTag` option dit not need to be cleared +to an empty array to prevent recursion because there are no +`