Hi,
You can reference a property of an object using a string key and
square brackets, so this:
var itemsToShow = "myOptions." + sel;
should be:
var itemsToShow = myOptions[sel];
...assuming that `sel` contains a string like "myOptions_group1", as
it appears to from the if/else structure you said works.
This is one of the more powerful features of JavaScript syntax, this
ability to reference a property by symbol:
x = myOptions.myOptions_group1;
...or by string, either a string literal:
x = myOptions["myOptions_group1"];
...or a string in a variable:
s = "myOptions_group1";
x = myOptions[s];
...since of course those are the same thing as far as the [] operator
is concerned.
HTH,
--
T.J. Crowder
Independent Software Consultant
tj / crowder software / com
www.crowdersoftware.com
On Apr 9, 2:56 am, thegdog <[email protected]> wrote:
> So here's what I am trying to do.
>
> I have a form with two <select> fields: issue and subissue. The
> second (subissue) is hidden by default. When the user selects one of
> the items in the first (issue), I want to populate the second with
> only certain options.
>
> So I have all the options in the subissue <select> and it is set to
> display: none. When the user selects an option in the issue <select>,
> I pass the value to the processIssue function, which first hides all
> the options in the subissue <select>. Then it builds out the name of
> the array reference. ANd in theory, uses that to show certain options
> (based on their ids in the arraty), and then unhide the <select>.
>
> The problem is that when it hits the if block, itemsToShow is a
> string, not the array reference.
>
> Here is some of the relevant code as I have it:
>
> <script type="text/javascript">
>
> var myOptions = {
> myOptions_group1: [ "group1_1", "group1_2", "group1_3", "group1_4" ],
> myOptions_group2: [ "group2_1", "group2_2" ],
> myOptions_group3: [ "group3_1", "group3_2" ]
>
> }
>
> function processIssue(sel) {
> $$("#subissue>option").invoke("hide");
>
> var itemsToShow = "myOptions." + sel;
>
> if (itemsToShow) {
> for (var i=0, l=itemsToShow.length; i<l; i++) {
> $(itemsToShow[i]).style.display = '';
> }
> $("issueRefine").style.display = '';
> }
>
> }
>
> </script>
>
> <form>
> <select name="issue" id="issue" onchange="processIssue(this.value)">
> <option value="myOptions_group1">Group 1</option>
> <option value="myOptions_group2">Group 2</option>
> <option value="myOptions_group3">Group 3</option>
> <option value="myOptions_group4">Group 4</option>
> </select>
>
> <select name="subissue" id="subissue">
> <option id="group1_1">1_1</option>
> <option id="group1_2">1_2</option>
> <option id="group1_3">1_3</option>
> <option id="group1_4">1_4</option>
> <option id="group2_1">2_1</option>
> <option id="group2_2">2_2</option>
> <option id="group3_1">3_1</option>
> <option id="group3_2">3_2</option>
> </select>
> </form>
>
> If I change the processIssue function to this, it works great:
>
> function processIssue(sel) {
> $$("#subissue>option").invoke("hide");
>
> if (sel == 'myOptions_group1') {
> for (var i=0, l=myOptions.myOptions_group1.length; i<l; i++) {
> $(myOptions.myOptions_group1[i]).style.display = '';
> }
> $("issueRefine").style.display = '';
> }
> else if (sel == 'myOptions_group2') {
> for (var i=0, l=myOptions.myOptions_group2.length; i<l; i++) {
> $(myOptions.myOptions_group2[i]).style.display = '';
> }
> $("issueRefine").style.display = '';
> }
> else if (sel == 'myOptions_group3') {
> for (var i=0, l=myOptions.myOptions_group3.length; i<l; i++) {
> $(myOptions.myOptions_group3[i]).style.display = '';
> }
> $("issueRefine").style.display = '';
> }
> else {
> $("issueRefine").style.display = 'none';
> }
>
> }
>
> I was hoping to avoid this however, as the list is going to be pretty
> long and I wanted to reduce the amount of code.
>
> Can anyone suggest a good way to do this? I will admit that I am not
> the most proficient JS developer on the planet, but I usually have a
> good understanding of things. Just not sure how I can build the
> reference to the array object.
>
> Would appreciate any assistance you could provide.
--
You received this message because you are subscribed to the Google Groups
"Prototype & script.aculo.us" group.
To post to this group, send email to [email protected].
To unsubscribe from this group, send email to
[email protected].
For more options, visit this group at
http://groups.google.com/group/prototype-scriptaculous?hl=en.
