Dr. Henry's Emergency Lessons for People!

You know on-paper forms where they have checkboxes? "Did you hear about us from A? B? C? Other?" Then there's a place to write in what "Other" means? That's what I'm doing, except I'm doing it online.

view plainprint?

1. <fieldset id="sample">  
2.     <select name="test" id="test" size="4">         <option> Foo </option>         <option> Bar </option>         <option> Blee </option>         <option> Other </option>    </select>  
3.     <span class="other"></span>  
4. </fieldset>  

              Foo           Bar           Blee           Other     
    

That's the roughness. I'm trying to make a general solution, so I have a span after every select. And here's where the problem comes.

I want to watch every select click. That's easy in jQuery. I want to then check to see if the value is now 'other'. That also is easy.

view plainprint?

1. $( 'select' ).click( function() {  
2.     var strVal   = $( this ).attr('value') ;  
3.     if ( strVal == 'Other' ) {  
4.         ...  
5.         }  
6.     else {  
7.         ...  
8.         }  
9.     }) ;  

    $( 'select' ).click( function() {
        var strVal   = $( this ).attr('value') ;
        if ( strVal == 'Other' ) {
            ...
            }
        else {
            ...
            }
        }) ;

What I want to do now is create an input box to put the "other" text in. And if I could do it in an object-y kind of way, I can.

view plainprint?

1. $( 'select' ).click( function() {  
2.     var strVal   = $( this ).attr('value') ;  
3.     var strOther = $( this ).parent().attr('id') + '_other' ;  
4.     var strHTML = '<input type="text" name="' + strOther + '">'  
5.     if ( strVal == 'Other' ) {  
6.         $( this ).parent().children('.other').html( strHTML ) ;  
7.         }  
8.     else {  
9.         $( this ).parent().children('.other').html('') ;  
10.         }  
11.     }) ;  

    $( 'select' ).click( function() {
        var strVal   = $( this ).attr('value') ;
        var strOther = $( this ).parent().attr('id') + '_other' ;
        var strHTML = ''
        if ( strVal == 'Other' ) {
            $( this ).parent().children('.other').html( strHTML ) ;
            }
        else {
            $( this ).parent().children('.other').html('') ;
            }
        }) ;

But wouldn't it be better to do things with a more object-like interface? I fill one of those selects dynamically, with code that works like this:

view plainprint?

1. clearSelectBox( document.getElementById('test') ) ;  
2.   
3. function fillSelectBox_SOLiD ( obj_sel ) {  
4.     var valueArray = new Array( '1 cell' , '4 cell' , '8 cell' , 'Other' ) ;  
5.     for ( var i = 0 ; i < valueArray.length ; i++ ) {  
6.         var obj_option = document.createElement('option') ;  
7.         obj_option.text = valueArray[i] ;  
8.         try {  
9.             obj_sel.add( obj_option , null ) ;  
10.             // standards compliant; doesn't work in IE  
11.             }  
12.         catch(ex) {  
13.             obj_sel.add( obj_option ) ;  
14.             // IE only  
15.             }  
16.         }  
17.     }  

clearSelectBox( document.getElementById('test') ) ;

function fillSelectBox_SOLiD ( obj_sel ) {
    var valueArray = new Array( '1 cell' , '4 cell' , '8 cell' , 'Other' ) ;
    for ( var i = 0 ; i < valueArray.length ; i++ ) {
        var obj_option = document.createElement('option') ;
        obj_option.text = valueArray[i] ;
        try {
            obj_sel.add( obj_option , null ) ;
            // standards compliant; doesn't work in IE
            }
        catch(ex) {
            obj_sel.add( obj_option ) ;
            // IE only
            }
        }
    }

I would much rather create the input by saying something like var newInput = document.createElement('input') than just writing the HTML, but until I can do something like that in JS, I will keep as is.

Any pointers?

Self-Introduced Bugs

So, I have 3 different SQL statements that handle three different cases, and the mechanism that dealt with it spat out hashes. (I code Perl. Just making this clear early on.)

I wanted to unify the three hashes into one hash. The way I liked best was to push pointers to the hashes into an array, iterating through that array, and taking each hash and dumping the values into a master hash.

view plainprint?

1. my %te_ids ;  
2. my @loop ;  
3. push @loop, \%te_ids1 ;  
4. push @loop, \%te_ids2 ;  
5. push @loop, \%te_ids3 ;  
6. for my $hash ( @loop ) {  
7.     for my $k ( keys %te_ids2 ) {  
8.         $te_ids{ $k } = 1 ;  
9.         }  
10.     }  

    my %te_ids ;
    my @loop ;
    push @loop, \%te_ids1 ;
    push @loop, \%te_ids2 ;
    push @loop, \%te_ids3 ;
    for my $hash ( @loop ) {
        for my $k ( keys %te_ids2 ) {
            $te_ids{ $k } = 1 ;
            }
        }

That might not be the best way to join hashes, but it is the way I liked. I have the join code once, so if I decide "hey, this works much better!", I don't have to fix it more than one place.

But do you see the problem? Do you see why I wasn't getting values off %te_ids1 and %te_ids3? Do you see it?

I didn't. Not for a while.

(And to be honest, I used sort keys %te_ids2, when sorting the keys added to the overhead with no benefit at all. Just a piece of cargo-cult programming I have to rid my mind of.)

This is the fixed version. The version where I actually use the refs to hashes I shove into the array.

view plainprint?

1. my %te_ids ;  
2. my @loop ;  
3. push @loop, \%te_ids1 ;  
4. push @loop, \%te_ids2 ;  
5. push @loop, \%te_ids3 ;  
6. for my $hash ( @loop ) {  
7.     for my $k ( keys %$hash ) {  
8.         $te_ids{ $k } = 1 ;  
9.         }  
10.     }  

    my %te_ids ;
    my @loop ;
    push @loop, \%te_ids1 ;
    push @loop, \%te_ids2 ;
    push @loop, \%te_ids3 ;
    for my $hash ( @loop ) {
        for my $k ( keys %$hash ) {
            $te_ids{ $k } = 1 ;
            }
        }