Sending originalArray and newArray

[beanben]

Hello hello,

apologies for the basic question but I am using struggling to send the originalArray and the newArray with the new order of the elements.

Any tips welcome !

the JS:

var sortable = Sortable.create(selection, {
  handle: '.bars-move',
  animation: 150,
});

var modalForm = document.getElementById("modalForm");
if (modalForm  !== null ){
  modalForm.addEventListener('submit', function(e) {

    var formData = new FormData(modalForm);
    e.preventDefault();
    var request = new XMLHttpRequest();
    request.open(modalForm.method, modalForm.action, true);
    var cookies = parse_cookies();
    request.setRequestHeader('X-CSRFToken', cookies['csrftoken']);

    // var originalArray = ????;

    var newArray = [...document.querySelectorAll("#selection > tr")].map(el => el.getAttribute("data-id"));
    formData.append('newArray', JSON.stringify(newArray));

    request.send(formData);
  });
};

In the code above, newArray sends the new array - no problem - but I have no idea how to write originalArray.

thank you.

[waynevanson]

@Arico1985

Check out docs relating to toArray() in the readme.

I'm not sure what the difference between these two arrays are. Could you please be a little more specific?

[beanben]

Hi @waynevanson !, thanks for taking the time to deal with my query.

Basically say you have an array with data-id attributes of [1, 2, 3, 4), the originalArray. After the user re-orders it to [2,1,4,3], the sortableArray, I want the user to send both arrays on submit.

[waynevanson]

Here are the docs you're looking for:

https://github.com/SortableJS/Sortable#store
https://github.com/SortableJS/Sortable#save
https://github.com/SortableJS/Sortable#toarraystring

You have to save whatever store you have before the user changes it.

[beanben]

Sweet, I will try and most likely post more questions soon. Thank you !