Concatenate Selectors

HTML & CSS
1

Hi.

I would like to ask for a solution to implement concatenate selectors, where the first selector would express a product and the second one the size to direct to the family product.

Thanks very much.

2

Sorry pal, I do not understand anything. Try a better description of the problem.

3

Yeah sorry it is very unclear. Also not clear if you are referring to css or javascript/jquery selectors?
A better description and a perhaps a sample code of what you have so far would help considerably.
D

4

Sounds like a CSS question.

Maybe something like this:


<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<style>
.product {
	background:red;
	border:1px solid #000;
	width:200px;
	height:100px;
	margin:10px;
}
.small {
	width:100px;
	height:50px;
	background:green;
}
.large {
	width:300px;
	height:150px
}
</style>
</head>

<body>
<div class="product">Product 1</div>
<div class="product small">Product 2 small</div>
<div class="product large">Product 3 large</div>
</body>
</html>
5

No, it is nothing about css.

What I need is a set with two select boxes to include categories (products) and subcategories (sizes) and links to visit the final categories by clicking on a button after selecting the options in the two of them.

6

I see.

You are talking about combo boxes.

There are a great deal of them on the Internet, and much information on their structure and programming.

Here you have an good number and variety of them. Specifically [URL=“http://javascriptkit.com/script/cut183.shtml”]this one, that I think it is exactly what you are looking for. Aren’t you?

7

Superb!!! It is exactly was I was looking for. Thanks José.

8

That has nothing to do with combo boxes - combo boxes allow you to enter your own value if you don’t like any in the associated list.

What the OP was asking about is linking two select lists together. With combo boxes since anything can be entered in the first combobox you can’t have a second one linked to it.

9

Hi felgall.

You are right in essence, but you know that nowadays the term is also used to mean drop-down list (or lists) in which allows the user to select an option or options.

Sometimes it is defined as “non-editable combo box” to clarify the difference with a pure combo box.

I think that the distinction is still made in languages as Java, where they are not synonyms.

In this case, we could use the term “combo box”, but if we want to be purist, then ok, the proper name would be drop-down list(s).

10

Combo Box is a NEW HTML element introduced in HTML 5. While it might have been used as an alternative term for Select List while HTML didn’t support Combo Boxes now that HTML does support Combo Boxes people need to start making the distinction between the two.

Everywhere other than in HTML applications have always supported Combo Boxes and so the misuse of the term has only ever applied to HTML and only because a Select List was the closest the web used to supply to a Combo Box.

Unless you want to stick with HTML 4 and earlier you should not misuse the term Combo Box to refer to something coded a completely different way.

11

I am using HMTL4, and the script on the page linked by José Manuel works perfectly and is named “combo box” there.

12

I named it “combo box” because it is used as a synonym in diverse environments, but felgall is right, and considering the new context with HTML5 and the different meaning of the term in different languages, and to avoid confusing other members of this forum, we should talk about “drop-down list(s)”.