As you may have suspected this example is greatly simplified from what
I am working with. My real "div.entry"s look more like:
<div div class="entry">
<a href="#" id="123">
<img src="/img/filename.jpg" border="0" height="230"
width="176">
</a>
<div class="createDateDIV">
<span class="labelSPAN">create date:</span>
<span class="valueSPAN">11-29-2007</span>
</div>
<div class="createDateIntDIV">
<span class="valueSPAN">1196312400813</span>
</div>
<div class="updateDateDIV">
<span class="labelSPAN">update date:</span>
<span class="valueSPAN">01-01-2008</span>
</div>
<div class="updateDateIntDIV">
<span class="valueSPAN">1199163600828</span>
</div>
<div class="createdByDIV">
<span class="labelSPAN">created by:</span>
<span class="valueSPAN">John Doe</span>
</div>
<div class="imageNameDIV">
<span class="labelSPAN">image name:</span>
<span class="valueSPAN">my filename picture</span>
</div>
<div class="sizeDIV">
<span class="labelSPAN">size:</span>
<span class="valueSPAN">large</span>
</div>
</div>
and my sorting looks more like:
$("#entries").each(function(prntI,prnt){
switch($("#myform div.displayOrderDIV input:checked").val()){
case "createDate":
$("div.entry",prnt).sort(function(a,b){
var x = $("div.createDateIntDIV
span.valueSPAN",a).html();
var y = $("div.createDateIntDIV
span.valueSPAN",b).html();
return ((x < y) ? -1 : ((x > y) ? 1 : 0));
}).appendTo(prnt);
break;
case "updateDate":
$("div.entry",prnt).sort(function(a,b){
var x = $("div.updateDateIntDIV
span.valueSPAN",a).html();
var y = $("div.updateDateIntDIV
span.valueSPAN",b).html();
return ((x < y) ? -1 : ((x > y) ? 1 : 0));
}).appendTo(prnt);
break;
case "imageName":
$("div.entry",prnt).sort(function(a,b){
var x = $("div.imageNameDIV
span.valueSPAN",a).html();
var y = $("div.imageNameDIV
span.valueSPAN",b).html();
return ((x < y) ? -1 : ((x > y) ? 1 : 0));
}).appendTo(prnt);
break;
}
});
Clicking radio buttons resorts the thumbnails, and yes, it is horribly
slow. Node tree navigation gets a little messy with this structure,
but I can tweak the nodes a bit to help that. It makes sense that
would be quicker (I think I was letting jQuery make me lazy ;). Any
other ideas would be greatly appreciated.
-wade
On Jul 10, 5:37 pm, "Michael Geary" <[EMAIL PROTECTED]> wrote:
> The browser doesn't render anything while you are running a script, only
> when the script stops. That's way alert() makes it work - it stops your
> script and gives the browser a chance to render. You could follow the
> blockUI() call with a 1 millisecond setTimeout call with the rest of your
> code inside the callback function.
>
> But wouldn't you rather have a faster sort? That sort function is going to
> be extremely slow. You may not need blockUI at all if the sort is fast
> enough.
>
> A question related to that: Is the .foo span always the first child element
> of each .entry div? There's one obvious speedup you can make if it is -
> a.firstChild.innerHTML instead of $('span.foo',a).html() - but also a much
> greater speedup by changing the sort algorithm. Let me know on that and I'll
> get back to you with a faster way to sort the entries - or maybe just the
> change above will be good enough.
>
> -Mike
>
>
>
> > From: traunic
>
> > Earlier today I was looking at sorting code like this:
>
> > <div id="entries">
> > <div class="entry"><span class="foo">foo1</span><span
> > class="bar">bar1</span></div> <div class="entry"><span
> > class="foo">foo2</span><span class="bar">bar2</span></div> ....
> > </div>
>
> > And in implementing this realized that there can be a
> > considerable delay in the processing if the number of
> > "#entries div.entry" is high.
> > So I wanted to use blockUI to let the user know the
> > application is working. I tried this:
>
> > $("#entries").each(function(prntI,prnt){
> > $.blockUI();
> > $("div.entry",prnt).sort(function(a,b){
> > var x = $("span.foo",a).html();
> > var y = $("span.foo",b).html();
> > return ((x < y) ? -1 : ((x > y) ? 1 : 0));
> > }).appendTo(prnt);
> > $.unblockUI();
> > });
>
> > But do not see any messages. If I add an alert after the
> > $.blockUI(); before the sort, then everything works as
> > expected (with the exception of the unwanted alert). Is
> > there a way to block -> sort -> unblock?
> > I am using blockUI v1.26 & jQuery v1.1.3.1
>
> > p.s. the sort thread that started this is:
>
> http://groups.google.com/group/jquery-en/browse_frm/thread/e0d6c19955...
