[SOLVED] Simple problem

[waynew]

I've a select box that allows the user to choose how many file attachments they want to add. So, say for example they choose the option "2", 2 file fields will appear, courtesy of

 

style.display = "table-row";

 

(File fields are located in table rows).

 

Works fine in FF, but throws up an error and doesn't work in IE7. The error is "Could not get the display property. Invalid argument.

 

The html:

<select name="attachments" id="attachments" onchange="return show_hide_uploadfields(this.value)">
        <option value="0" selected="selected">0</option>
         <option value="1">1</option>
          <option value="2">2</option>
          <option value="3">3</option>
          <option value="4">4</option>
          <option value="5">5</option>
    </select>

 

The JS is:

 

function show_hide_uploadfields(num){
    
    //hide all fields first
    var i = 1;
    while(i < 6){
        var id = "file" + i;
        document.getElementById(id).style.display = 'none';
        i++;
    }
    
    //show number user wants
    var i = 1;
    while(i <= num){
        var id = "file" + i;
        document.getElementById(id).style.display = 'table-row';
        i++;
    }
}

 

An example of my table row html:

<tr id="file1" style="display:none;">

[.josh]

table-row (or any of the table display types) is not supported by IE

[jackpf]

IE8 supports them

[.josh]

does it? I haven't really looked into IE8 all that much yet.  Even if IE8 were 100% standards compliant, people will still be f'ing using ie6 and ie7 for the next 10 years.

[jackpf]

Haha, yeah. But tbh, most people aren't going to care about standards compliance when choosing a browser. They don't have to program the damn sites, so they don't care.

[Psycho]

Just set the dsplay value to an empty string and the browser will display it as it you hadn't set any display value to begin with.

 

Also, that function could be written much more simply

function show_hide_uploadfields(num)
{
    var idx = 1;
    while(document.getElementById('file'+idx))
    {
        var displayValue = (idx<=num)?'':'none';
        document.getElementById('file'+idx).style.display = displayValue;
        idx++;
    }
}

[waynew]

Thanks Crayon. I actually never knew that.

Also, thanks Mjdamato for cleaning up my code a little. Sometimes I can be a bit of a lazy f*ck.

[waynew]

Post note:

 

F*ck anyone who uses IE6. They can go die in a fire.