2015-04-23 16 views
5

Sto facendo un ordinamento su div, ma non riesco a eseguire un ordinamento. Sto usando jQuery.fn.sortElements. di seguito è l'html.non funziona in jquery

<div id="sortList"> 
    <div class="list" style="display: block;"> 
     <a onclick="openInfoWindow("10"); return false;" href="#"></a> 
     <div class="imgClass"> 
      <a onclick="openInfoWindow("10"); return false;" href="#"> 
      <img class="innerImg" alt="" src="img"> 
      </a> 
     </div> 
     <div class="inner"> 
      <div class="name">edata</div> 
     </div> 
    </div> 

    <div class="list" style="display: block;"> 
     <a onclick="openInfoWindow("10"); return false;" href="#"></a> 
     <div class="imgClass"> 
      <a onclick="openInfoWindow("10"); return false;" href="#"> 
      <img class="innerImg" alt="" src="img"> 
      </a> 
     </div> 
     <div class="inner"> 
      <div class="name">fdata</div> 
     </div> 
    </div> 

    <div class="list" style="display: block;"> 
     <a onclick="openInfoWindow("10"); return false;" href="#"></a> 
     <div class="imgClass"> 
      <a onclick="openInfoWindow("10"); return false;" href="#"> 
      <img class="innerImg" alt="" src="img"> 
      </a> 
     </div> 
     <div class="inner"> 
      <div class="name">cdata</div> 
     </div> 
    </div> 
</div> 

Di seguito si riporta il codice jQuery, ho posto un avviso per vedere il risultato, ma non succede nulla.

$('.sortList').sortElements(function(a, b){ 
       alert($(a).find(".list").children(".inner").find(".name").text().toLowerCase())     
        return $(a).find(".list").children(".inner").find(".name").text().toLowerCase() > $(a).find(".list").children(".inner").find(".name").text().toLowerCase() ? 1 : -1; 
       }); 

Qualsiasi aiuto è molto apprezzato

+0

Il selettore ".sortList" trova ogni elemento con la classe sortList, tuttavia non ci sono elementi con quella classe. – Eterm

+0

Penso che dovresti chiamare la funzione sortElements sugli Elementi che vuoi ordinare e non il loro contenitore ... $ ('. SortList'). Children ('. List'). SortElements (function (a, b) –

+0

non ho una classe chiamata sortList ma e id – bmscomp

risposta

4

provate questo:

$('#sortList .list').sortElements(function(a, b){ 
     return $(a).children(".inner").find(".name").text().toLowerCase() > $(b).children(".inner").find(".name").text().toLowerCase() ? 1 : -1; 
}); 

Vedi Fiddle

+0

grandiosa! come sempre, soluzioni brevi ed esatte – Vikrant

+0

@ haim770 grazie ha funzionato :) –

2

Ci sono stati alcuni problemi:.

  • $ (' sortList ') dovrebbe essere $ (' # così rtList '),' # 'cerca id con' sortList 'e'. ' cerca classi con 'sortList'
  • è necessario chiamare sortElements nell'elenco di elementi non il contenitore così $ ('. SortList'). sortElements deve essere $ ('# sortList'). figli (". lista") .sortElements
  • nell'istruzione di ritorno della funzione di confronto è necessario confrontare aeb, non a con un
  • anche nella dichiarazione di ritorno non è necessario cercare ".list" si può andare dritto a '.inner'

Si prega di vedere JSFiddle: http://jsfiddle.net/qwmq61o5/1/

$('#sortList').children(".list").sortElements(function(a, b) { 
    return $(a).children(".inner").find(".name").text().toLowerCase() > $(b).children(".inner").find(".name").text().toLowerCase() ? 1 : -1; 
});