Jump to content
  • Checkout
  • Login
  • Get in touch

osCommerce

The e-commerce.

drop down boxes


usmanaa

Recommended Posts

Hi

 

I have a list of manufacturers and categories...

 

When u select a manufacturer from the dropdown box, is it possible to have another dropdown box appear, with the products for that manufacturer

 

is there a contribution for this?

Link to comment
Share on other sites

Hi,

 

When u select a manufacturer from the dropdown box, is it possible to have another dropdown box appear, with the products for that manufacturer

 

Sure, it's possible, all with Javascript and using events, mostly the 'onchange' event.

 

1. If you don't want the 'products for the manufacturer' dropdown to be visibly shown until a person selects from the manufacturers dropdown, then you will need to do a form/page reload/refresh.

 

2. If you want to have the 'products for manufacturer' dropdown 'visible' (but not populated until the manufacturer dropdown is changed), then you don't ned to do a form reload, you can simply use JS arrays and the use of "DIV" (innerHtml code).

 

Peter

Link to comment
Share on other sites

Hi,

 

Btw, your website is incredibly slow, I think that is why I didn't see the dropdowns on the left hand side, when I first visited, I got tired of waiting. :lol:

 

Ok take a second look, the vechicle search i am referring to, not the menus

 

Yes, that is similar to option 2 that I mentioned. The 2 lower level dropdowns are disabled, until a higher level dropdown is selected. Looks like frames are used.

 

Peter

Link to comment
Share on other sites

Hi,

 

There are some 'website speed tests' or similar somewhere. Someone wants me to compare their old site to the new one, so if my (fuzzy) brain remembers, I'll post the link back here when I find it.

 

Peter

Link to comment
Share on other sites

Hi Peter

 

Thats exactly what I need, the same as what u have done for the vechicle search... anychance I can get a copy of that code? or an some example code to do that.

 

Adil

Link to comment
Share on other sites

Hi,

 

The way I learnt how to do it, was when jofa , supplied some sample/example code to me, when I was trying to do a '3 level' dropdown in ASP. Please see his post and example code at:

 

http://www.sitepoint.com/forums/showthread...hlight=dropdown

 

it is post #7, where 'jofa' shows how to do this. Simply copy the code, save as dropdown_test.php, upload it, then run dropdown_test.php (or whateve you want to call it).

 

The great 'learning' part of this example by 'jofa' is that it uses the 'DIV" (innerhtml) to dynamically display the values from the dropdown boxes. This shows you how the use of dropdowns, with the 'onchange' event, simply goes and retrives the values from the JS array.

 

The example is a good one of what you want. Notice when you change from:

 

Type: DVDs

 

to

 

Type: Books

 

the values in the lower level dropdown (products) doesn't actually change. Don't be alarmed, the relevant product details are being retrieved from the array, and the dropdown 'rebuilt' (repopulated), the simple reason why the values in 'products' are the same is because of the array values.

 

To fix this simply change this:

 

      var ProductList = new Array();
     ProductList[0] = new Product('book', 'The Fellowship of the Ring', 39.95, 'This is a great book');
     ProductList[1] = new Product('book', 'The Two Towers', 39.95, 'This is another great book');
     ProductList[2] = new Product('book', 'The Return of the King', 39.95, 'This is a great book too');
     ProductList[3] = new Product('dvd', 'The Fellowship of the Ring', 19.95, 'You need this DVD if you fell asleep at the theatre - like I did');
     ProductList[4] = new Product('dvd', 'The Two Towers', 19.95, 'Coming next year');
     ProductList[5] = new Product('dvd', 'The Return of the King', 19.95, 'You have to wait one more year for this one');

 

to ............

 

      var ProductList = new Array();
     ProductList[0] = new Product('book', 'The Fellowship of the Ring', 39.95, 'This is a great book');
     ProductList[1] = new Product('book', 'The Two Towers', 39.95, 'This is another great book');
     ProductList[2] = new Product('book', 'The Return of the King', 39.95, 'This is a great book too');
     ProductList[3] = new Product('dvd', 'The Matrix', 19.95, 'You need this DVD if you fell asleep at the theatre - like I did');
     ProductList[4] = new Product('dvd', 'Dicky Roberts', 19.95, 'Coming next year');
     ProductList[5] = new Product('dvd', 'The Lion and the King', 19.95, 'You have to wait one more year for this one');

 

Now, don't be alarmed that the example is built using 'static' data. See my post, number 12 in the same thread, where I ask about populating the JS arrays from a database. This is how osC does it, but giving the 'static data' type example is easier to begin with.

 

I didn't like the 'shorthand' version of the Javscript code, at least not for a beginner. So, please see this thread:

 

http://www.sitepoint.com/forums/showthread...hlight=dropdown

 

where I asked about how the JS code works, especially this line:

 

var current = (frm.selCategory.value) ? CategoryList[frm.selCategory.value].name : '';

 

in longhand format, is the same as ............

 

if (frm.selCategory.value) 
current = CategoryList[frm.selCategory.value].name;
else
current = '';

 

which helped me a lot, to understand how it all works. I don't like programming unless I know how it works. :D

 

Hope that gets you going. Sorry, I have not replied sooner, 4 domains were off the air the last 2 days, and I had to give that priority. :)

 

Peter

Link to comment
Share on other sites

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...