I'm relatively new to javascript, and I'm trying to decide whether the
following (and if so, clues on how to do it):
I'd like to create two HTML multiple-select boxes. The first would be
a list of items, and the second would be a list of categories. By
clicking a category in the 2nd box, the members of that category (from
the first box) would be highlighted (indicated here by arrows). E.g.,
-- List of Nums -- -- Categories --
1 Odd
2 <-- Even <--
3 Prime
4 <--
5
Any help in this matter is greatly appreciated.
You probably won't get many suggestions because your requirements are
not clear and you've made no attempt to present a solution.
You seem to want to select options in one list based on the selection
from another list. That has been covered numerous times in previous
posts, search for 'dynamic option list', there's a thread here:
<URL:
http://groups.google.co.uk/group/co...mic+option+list&rnum=5&hl=en#79d89c8dd0f2e169>
An issue you haven't covered is how to determine the options to select,
here's some suggestions.
You can hard-code the results, something like:
If 'Odd' selected, select 1, 3, 5
If 'Even' selected, select 2, 4
If 'Prime' selected, select 1, 2, 3, 5
A second method is to formulate tests for each entry in the numbers list
that are based on the categories:
If 'Odd' selected, select entries where isOdd(num) is true.
isOdd() can be: return ( num%2 != 0 );
If 'Even' selected, select entries where isOdd(num) is false.
(this will select 0 as even, which it isn't so if it is possible
that zero will be one of the numbers, deal with it)
If 'Prime' selected, select entries where isPrime(num)
(where isPrime() is some function that tests for prime numbers)
Another method is to create objects for all the entries in the number
list. Each object can have properties for value, isPrime and isOdd.
Then iterate through them much like the above only test the property of
each object rather than using a function. Select the associated entry
in the list if object's value for the tested property is true.
<script type="text/javascript">
var numObj = new Object();
numObj.value = 6;
numObj.even = true;
numObj.prime = false;
function showNumObj()
{
alert(
'Value: ' + numObj.value
+ '\nEven?: ' + ((numObj.even)?'Yes':'No')
+ '\nPrime?: ' + ((numObj.prime)?'Yes':'No')
);
}
</script>
<input type="button" value="See numObj" onclick="showNumObj();"><br>
How you create the objects and assign values to the properties is, of
course, another story.
There are probably many other ways of achieving whatever it is you are
trying to do.