Member Avatar for scottyg13

Hi I was wondering if someone could help me with a code for my website? Basically what I want to do is have a drop down list that is essentially a matrix in the sense that picking one option leads to another and eventually you can narrow down the results and find what you're looking for.

for example if i was searching for cars:

what type of car: honda, ford, etc
what colour: red, blue, green etc
what year: 1999,2000 etc
price: under 5000, etc

and eventually these choices would lead to different results based on what the users input was. If I am posting in the wrong section I am sorry as I am new here and this seemed a good fit...thanks I appreciate any help I can get as I am a novice who has a website!

  • 2 Contributors
  • 4 Replies
  • 86 Views
  • 1 Day Discussion Span
  • Latest Post Latest Post by scottyg13

Dani AI

Generated

As hinted, this is normally solved on the front end with JavaScript. The pattern is called "cascading" or "dependent" dropdowns (also search for "chained selects" or "faceted search"). For a small fixed set of choices (makes, colors, years) keep a client-side JSON map and update child selects on the parent select's change event. For large or dynamic datasets, have the page call an AJAX endpoint that returns JSON options when a parent value changes.

Keep the flow simple: populate the top-level select, listen for change, clear and repopulate the next select, and repeat until the final selection triggers the search. A minimal client-side handler looks like:

document.getElementById('make').addEventListener('change', function(e) {
  var models = data[e.target.value] || [];
  var modelSel = document.getElementById('model');
  modelSel.innerHTML = '';
  models.forEach(function(m){
    var opt = document.createElement('option');
    opt.value = m;
    opt.text = m;
    modelSel.appendChild(opt);
  });
});

Practical tips: disable child selects until a parent is chosen, offer an "Any" option, use autocomplete/typeahead instead of long selects, cache AJAX responses, and always validate inputs server-side with parameterized queries to prevent injection. For shareable results, push filter state into the URL query string so searches can be bookmarked. These choices make the UI responsive and safe for production.

Recommended Answers

All 4 Replies

Member Avatar for NormR1

Is this a java programming question?

Member Avatar for scottyg13

I have no idea. I was just looking for someone to point me in the right direction - maybe even give me the name of what I am looking for so I can google search it...like a drop down matrix? I know nothing someone please enlighten me.

Member Avatar for NormR1

Try asking the question on a javascript forum or an html forum.
It doesn't sound like java programming.

Member Avatar for scottyg13

Ok thanks

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.