How auto load items on page

Question

Taxonomy page will have sidebar which will have taxonomy menu items and grid layout with image and brief details.

For example, taxonomy items have brand by certain names, price range, etc. User click on brand name, the grid layout will auto load the brand products without have going to /products/brand_name. On page, it will be /products, and then every brand name will show different products automatically loading on same page.

Is there such a way to do this? Or there is a module which can do that?

Example I found is http://www.cynosure.com/products/

Click on any from menu on left column, you will see the products reloaded by menu click.

Answer 1

This can be achieved using exposed filters feature of the Views module. Here is an article explaining this process in detail.

http://www.bryanbraun.com/2013/08/06/drupal-tutorials-exposed-filters-with-views

You would also need the Better Exposed Filters(BEF) module for displaying the filters as links.

Answer 2

Views module will do this for you. If the items in the column is limited and you know what they are, you can create different pages for every one, each page indicates certain filtering. but you need Ajax call to load information in the same page. if your View name is product and then you need some thing like this

        $.ajax({
            url: Drupal.settings.basePath + 'views/ajax',
            type: 'POST',
            dataType: 'json',
            data: 'view_name=product&view_display_id='+view_display_id,
            success: function(response) {
              var output = response[1].data;
              $("#A_CONTAINER_TO_DISPLAY_CONTENT").html(output);
            },
            error: function(data) {
                $("#A_CONTAINER_TO_DISPLAY_CONTENT").css("display","none");
                alert('An error occured!');
            }
          });

view_display_id is the machine name in here:

And don't forget to set the use Ajax to yes