javascript - Change the settings of Sortablejs after its set - Stack Overflow

admin管理员组

文章数量:1391929

I am having trouble to change my sortablejs settings after its set.
The initialization of this function is done within an other script(this script may not change) and is done when the page is loaded.
what i have for code in other script is the following:

//initialize sortable
function initSortable() {
   $(".menu-item-list").each(function (index) {
      var id = this.id;
      var options = {
         animation: 150,
         group: "menu-item-list",
         chosenClass: "sortable-chosen",
         ghostClass: "sortable-ghost",
         filter: ".empty-area-text",
         cancel: ".empty-area-text",
         onAdd: function (e) {
            //moved to the new column. save the items position
            saveItemsPosition();
            removeEmptyAreaText(e.to);
            addEmptyAreaText(e.from);
            adjustHeightOfItemsContainer();
            removeSubmenuClass(e.item, e.to);
         },
         onUpdate: function (e) {
            //moved to the same column. save the items position
            saveItemsPosition();
            adjustHeightOfItemsContainer();
            removeSubmenuClass("", "");
         }
      };
      Sortable.create($("#" + id)[0], options);
   });
}

I am having trouble to change my sortablejs settings after its set.
The initialization of this function is done within an other script(this script may not change) and is done when the page is loaded.
what i have for code in other script is the following:

//initialize sortable
function initSortable() {
   $(".menu-item-list").each(function (index) {
      var id = this.id;
      var options = {
         animation: 150,
         group: "menu-item-list",
         chosenClass: "sortable-chosen",
         ghostClass: "sortable-ghost",
         filter: ".empty-area-text",
         cancel: ".empty-area-text",
         onAdd: function (e) {
            //moved to the new column. save the items position
            saveItemsPosition();
            removeEmptyAreaText(e.to);
            addEmptyAreaText(e.from);
            adjustHeightOfItemsContainer();
            removeSubmenuClass(e.item, e.to);
         },
         onUpdate: function (e) {
            //moved to the same column. save the items position
            saveItemsPosition();
            adjustHeightOfItemsContainer();
            removeSubmenuClass("", "");
         }
      };
      Sortable.create($("#" + id)[0], options);
   });
}

• javascript
• sortablejs

Share Improve this question Follow asked Mar 13 at 8:55 oelimoeoelimoe 42122 silver badges1111 bronze badges

Add a comment  | 

1 Answer 1

Sorted by: Reset to default 0

To make it so that you can change the settings is by using

setTimeout(() => { // timeout is important
   $(".menu-item-list").each(function() {
      let instance = Sortable.get(this); // Get existing Sortable instance
      if (instance) {
         // Apply the updated filter setting
         instance.option("multiDrag", true);
         instance.option("selectedClass", "selected");
         instance.option("fallbackTolerance", 3);
      }
   });
}, 500);

本文标签： javascriptChange the settings of Sortablejs after its setStack Overflow