?
Solved

Dynamic Item Filter

Posted on 2009-06-30
5
Medium Priority
?
505 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
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 3
  • 2
5 Comments
 
LVL 5

Assisted Solution

by:kingofnines
kingofnines earned 1000 total points
ID: 24744278
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
ID: 24744632
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 1000 total points
ID: 24744717
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
ID: 24746416
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
ID: 24749366
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

VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

These days socially coordinated efforts have turned into a critical requirement for enterprises.
This article discusses how to create an extensible mechanism for linked drop downs.
Explain concepts important to validation of email addresses with regular expressions. Applies to most languages/tools that uses regular expressions. Consider email address RFCs: Look at HTML5 form input element (with type=email) regex pattern: T…
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…
Suggested Courses

777 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