Solved

Dynamic Item Filter

Posted on 2009-06-30
5
484 Views
Last Modified: 2013-12-13
I was checking a website for a camera the other day and I noticed this nice dynamic filter system. Basically all cameras available are shown at first then ticking certain checkboxes causes some to grey out as they do not match the criteria. I had a look at the source code but could not discern much from it. Does anyone have experience of this and can they explain how this works?

I'm guessing that it uses javascript to dynamically query a database. It looks nice and is very easy to use but I think the downside is you can only have a limited number of items as that would place too much strain on the server. Here's the website

http://www.fujifilm.co.uk/consumer/digital/digital-cameras/view-all

any help appreciated!
0
Comment
Question by:allanch08
  • 3
  • 2
5 Comments
 
LVL 5

Assisted Solution

by:kingofnines
kingofnines earned 250 total points
Comment Utility
You are correct, it is done with javascript and jquery. Im not sure what "strain" you are reffering to. It is only running one query at any given time so there is no sttrain at all. The limit on items per page would be a design and usability issue, not a server load issue.


Alan
0
 

Author Comment

by:allanch08
Comment Utility
thanks for the reply, I undertand it is just one query at a time but what if there are hundreds or even thousands of users using it at any one time.
0
 
LVL 5

Assisted Solution

by:kingofnines
kingofnines earned 250 total points
Comment Utility
As far as I know, there are very few sites that are big enough to have to worry about that kind of volume. And those that are, have some pretty serious server setups to handle it. I'm not sure what the question is that you are asking, but as far as server load I don't think you will have to worry about it. You can see on the camera site how fast the reaction time is. You would have to have many, many users hitting the site at the same split second to affect the sites performance. If you are fortunate enough to have hundreds or thousands of users at your site at exactly the same time then you can surely afford to beef up your servers to handle the load.


Alan


Alan
0
 

Accepted Solution

by:
allanch08 earned 0 total points
Comment Utility
okay, guess I don't have to worry about a server having problems handling this. I take you point that having too many items to start off with can be a problem and affect usability.

I managed to find this tutorial which looks good:

http://jetlogs.org/2009/04/03/filtering-lists-with-multiple-categories-using-jquery/
0
 

Author Comment

by:allanch08
Comment Utility
having another look at the fuji website I think I have a better understanding of how it works. I'd say the database of products is queried once on page load to get all results. each item has some kind of javascript tag as shown below. the checkboxes then filter out the items accordingly with the help of jquery. so basically all the hard work is done on the client side.
cameras['finepix-s5-pro'] = ['over_150', 'face-detection', 'metal-body', 'real-photo-technology', 'large-lcd-screen'];// 499.99

Open in new window

0

Featured Post

How to run any project with ease

Manage projects of all sizes how you want. Great for personal to-do lists, project milestones, team priorities and launch plans.
- Combine task lists, docs, spreadsheets, and chat in one
- View and edit from mobile/offline
- Cut down on emails

Join & Write a Comment

Foreword (July, 2015) Since I first wrote this article, years ago, a great many more people have begun using the internet.  They are coming online from every part of the globe, learning, reading, shopping and spending money at an ever-increasing ra…
Password hashing is better than message digests or encryption, and you should be using it instead of message digests or encryption.  Find out why and how in this article, which supplements the original article on PHP Client Registration, Login, Logo…
The viewer will learn how to dynamically set the form action using jQuery.
The viewer will learn how to create and use a small PHP class to apply a watermark to an image. This video shows the viewer the setup for the PHP watermark as well as important coding language. Continue to Part 2 to learn the core code used in creat…

763 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

11 Experts available now in Live!

Get 1:1 Help Now