One of two simple sorts isn't working. Can't reset original order (js/jq)

JavaScript
1

I’ve been out of scripting for a good time and thought to make a “quick” upgrade to this page…

http://www.solartiming.com/store--e-books-TMP.php

The original order of the books is shown when it loads.

For the category Newest, I made data-rev attributes so I could reverse sort them with the newest ones on top. This works.

Now, this seems to be “holding on” to the code, or I can’t find what I have to reset, so that clicking Show ALL books will show the original order again…

I’ve tried two methods that I can’t get to work …

(1) Using the same sort code, but with data-srt attribute that I added for that (see code)

(2) Using cloning of #ebooks div and replaceWith

The code when clicking the picker is …

$("ul#picker li").click(function() {                                // clicking cat picker

    $("ul#picker li").removeClass("active");						// (remove li's class="active" if there is one)
	var $cat = $(this).data("cat");									// get content of data-cat=""
    $(this).addClass("active");                                     // add class="active" to newly chosen category
    var $xtra = $("#picker li.active").data("cat");                 // store cat so we can later hide $xtra-xtra
    $("div[class$='-xtra']").hide();                                // hide all '[cat]-extra' divs
    $("hr").removeClass("hide");                                    // make all <hr> visible again
    
    if ($cat==="ALL") { 											// Show ALL
        $(".book").show();
        $(".book").sort(function (a, b) {                           // sort all .book divs to original order [WIP]
            var contentA =parseInt( $(a).data("srt"));
            var contentB =parseInt( $(b).data("srt"));
        }).appendTo("#ebooks");

        $(".book").last().children("hr").addClass("hide");          // hide <hr> after last .book (if there is one)
        return false;	                                            // STOP here
	}

    $(".book").show();                                              // show(reset) full lists
	$(".book, .show").not("." + $cat).hide();                       // hide all, except selected Cat divs
    $("." + $xtra +'-xtra').show();                                 // show [cat]-xtra divs
    $('.read-more').addClass('hide');                               // close up any opened 'Read more' blocks
    $('.read-more-show').removeClass('hide');

    if ($cat==="New") {                                              // if Newest was clicked
            $("."+$cat).sort(function (a, b) {                       // reverse sort selected cat divs w help of data-rev="nr" (recent on top)
            var contentA =parseInt( $(a).data("rev"));
            var contentB =parseInt( $(b).data("rev"));
            return (contentA < contentB) ? -1 : (contentA > contentB) ? 1 : 0;
        }).appendTo("#ebooks");
    };
    $("."+$cat).last().children("hr").addClass("hide");             // hide <hr> after last .book (if there is one)
});

Thank You for looking!

2

Gonna confuse everyone with using $'s on your variables in javascript, first of all :wink:

You… didn’t give the sort function a return, so it’s not actually going to do any sorting.

2 Likes
3

I thought it was somewhat standard, to indicate a jQuery object.

4

To me, it just looks like PHP that way. shrug. Context is probably important. In a pure JS environment, maybe. On a forum that does both…

5

Thanks. I was indeed confused over that again, since it’s been a while. I think with the $ it gets a more credible color here. When a variable turns white, I’m wondering what I did wrong more :wink: I have picked up stuff from examples, probably not from reading a book from chapter 1 (though I did once)… I will remember now!

But… why then does it work for the other instance?

I got the code from the first reply here and it doesn’t seem to mention such things (too basic maybe). I think I do need to use the appendTo variation, and I don’t get why it would not have executed it after I add that code… So, still pretty clueless…
https://javascriptio.com/view/37179/sort-divs-in-jquery-based-on-attribute-data-sort

I’ll rename my variables now. Who knows what might happen… :stuck_out_tongue:

6

Ok, so the variable color did not change without the $ in front…
But it’s now more confusing and dangerous cos I can have some of those words as a class name, or here, for example, cat is also a potential URL parameter.
This makes I can not do “mindless” Search & Replace on these names anymore, and maybe why I added the dollar sign…

Anyway, my feeling is it has another cause. It’s like the code neglects the books that were sorted and does not see them as having class .book anymore. I felt it might have to to with a visible or hidden state it added to the books, as adding :visible in a previous experiment made part of it work. I just can’t figure out the whole reason…

7

OMG, I indeed forgot the whole return line… Jeez!!! :roll_eyes:

Let me try this now… TIA!! :blush:

8

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.