Member Avatar for peck3277

Hi Guys,

Hoping someone can help me here. I am building a sports supplements e-commerce sitev using php and a mysql database. As such when someone goes to buy an item they have multiple choices i.e size and flavour of a certain product.

Someone selects a product they want to buy, they now have to choose a size and a flavour from 2 seperate drop down menus populated by the database.

What I want to have happen is have people first choose the flavour of the product, the size will be grayed out at this time. Once chosen the size list will become available populated with the available sizes in that flavour.

Now I believe this can be done with javascript, but I would prefer to be able to have it done using php(possibly having to do a page refresh?) so it will be compatible with people who have javascript turned off.

I have no idea where to begin searching with this one so if someone could provide me with a few links to examples or some such I would be very grateful!

Also if someone does know of a javascript way which falls back to being compatible if JS is turned off that would be fantastic!

Thanks!

  • 2 Contributors
  • 1 Reply
  • 75 Views
  • 16 Hours Discussion Span
  • Latest Post Latest Post by Jerail
Member Avatar for Jerail

My initial reaction when reading your post was that you should use JavaScript! Then I saw that you were ruling out this option. I think the ideal thing for you to do would be to set up a system that uses XMLHttpRequest (JavaScript/AJAX) which would allow you to dynamically populate each drop-down menu, as the last one is changed.

You're correct in that this could cause problems for users without JavaScript enabled. I don't think this minority of people should stop the majority from having a nice experience with AJAX, but they should be accommodated. You might want to check for JavaScript when they enter your order page, and set a cookie or session variable.
If they don't have JavaScript enabled, then you can use pure PHP, but you'll have to set up some sort of rudimentary state management system, since PHP doesn't have that natively.

When the person submits the value of the first drop-down, you'll have to echo back the same drop-down except with the option they chose before pre-selected, along with the next drop-down populated.

I was thinking maybe you could set the AJAX request to execute onChange of the drop-down box. The, place a submit button in <noscript>. To be safe, also set up a JavaScript function that stops the "enter" key from submitting the form.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.