Reorder multifield items through javascript

[gskittu]

Hi Team,

I have a multifield with 2 fields in which one is date field, On the dialog submit  I want to reorder multifield items based on date (oldest date item should show first and it should also store at the jcr node)

Example:

item0 => date : 01/01/1998
              name : John

item1 => date : 01/01/1995
             name : Ram

item2 => date : 01/01/1990
             name : shyam

When I reopen dialog , The oldest date item should show first like below

item0 => date : 01/01/1990
            name : shyam

item1 => date : 01/01/1995
           name : Ram

item2 => date : 01/01/1998
          name : John

Thanks in advance

[arunpatidar]

on dialog submit click event you need to reorder multifield item in HTML DOM.

[gskittu]

Thanks Arun, Yes need to reorder elements in DOM, I need help with javascript to reorder html elements 

[arunpatidar]

var wrapper = $('multifield'), 
items = wrapper.children('multifield-item'),
arr = [2,1,0];

wrapper.append( $.map(arr, function(v){ return items[v] }) );

This is just an example, there are more

https://stackoverflow.com/questions/34685316/reorder-html-elements-in-dom 

https://www.benjaminrancourt.ca/how-to-sort-divs-based-on-contents/ 

[gskittu]

Hi Arun, Thanks for your response. I would like to know, Is there any event listener for dialog submit and can modify the payload to reorder items.?

[arunpatidar · Accepted solution]

yes, there is

$(document).on("click", ".cq-dialog-submit", function (e) {
        //$(window).adaptTo("foundation-ui").alert("Close", "Dialog closed, selector [.cq-dialog-submit]");
    });

 or

$document.on("dialog-success", function() {
        //$(window).adaptTo("foundation-ui").alert("Save", "Dialog content saved, event [dialog-success]");
    });