Question

I’ve done my ordering in my code but instead of reloading the whole json result, I want a client side reorder for my divs.

My C# code for ordering is:

.OrderBy(p=> p.order == 0? int.MaxValue : p.order);

This give me result like

• 1
• 2
• 3
• 4
• 0
• 0
• 0

My Html schema is like

<div class="item" data-sort="0" id="5051fb7c746eed1bf05309db">
 <span>Some values</span>
 <span>Some values</span>
  <div class="subgroups">
    <div class="item" data-sort="null" id="5060de4a746eed1b44cc6e90"></div>
  </div> <!-- closing subgroups -->
</div> <!-- closing main div which need to be sorted -->

<div class="item" data-sort="2" id="5051fb7c746eed1bf05309db">
  <span>Some values</span>
  <span>Some values</span>
  <div class="subgroups">
    <div class="item" data-sort="null" id="5060de4a746eed1b44cc6e90"></div>
  </div> <!-- closing subgroups -->
</div> <!-- closing main div which need to be sorted -->

<div class="item" data-sort="0" id="5051fb7c746eed1bf05309db">
  <span>Some values</span>
  <span>Some values</span>
  <div class="subgroups">
    <div class="item" data-sort="null" id="5060de4a746eed1b44cc6e90"></div>
  </div> <!-- closing subgroups -->
</div> <!-- closing main div which need to be sorted -->

How can I reorder these divs so that the 2nd one become first and those with 0 data will be last upon reordering.

Answer 1

Take a look at the jQuery plugin TinySort if you’re using jQuery. Here is an example of its use:

$(".item").tsort({ attr: 'data-sort',order:'desc'});

I think if you can output 0 or -1 instead of null to the data-sort attribute it should put those items at the end.