Filtering Quicksand using Query String

Question

FYI I suck at javascript and can't wrap my head around Query Strings.

My question is regarding Quicksand http://razorjack.net/quicksand/index.html

How do I modify the http://razorjack.net/quicksand/scripts/main.js using javascript to allow for sorting based on the given filters via an incoming URL.

Demo's given filters:

Filter by type: Everything, Applications, Utilities

Sort by: Name, Size

So the incoming URLs could look like this depending on what parameters you use, overiding the default view:

razorjack.net/quicksand/index.html?Type=Everything&Sort=Size

razorjack.net/quicksand/index.html?Type=Utilities&Sort=Name

score 0 · Answer 1 · edited Jun 20 '20 at 09:12

That Quick Sand Plugin does not sort or filter objects , all it does it replace one list of objects with another , the whole point of it is the cool animation.

So you need to do the sorting and/or filtering somewhere else , probably best on the server side if the results are comming from a database , then put them in a list , then call the Quick Sand plugin to replace the current list with the one you just created

  function loadPageVar (sVar) {  
  return unescape(window.location.search.replace(new RegExp("^(?:.*[&\\?]" + escape(sVar).replace(/[\.\+\*]/g, "\\$&") + "(?:\\=([^&]*))?)?.*$", "i"), "$1"));  
}  

// Would alert the value of QueryString-variable called name  
alert(loadPageVar("Type"));

That is an example of how to get a query string's value in javascript from This Question

If you don't have that many items in your list, then you could type all your lists out in HTML ahead of time , and set the classes to hidden, then based on the query string you'll know which one to show

Filtering Quicksand using Query String

1 Answers1