javascript getElementById重新填充多行

Question

I'm getting some stuff from the web formular using:

 echo "<tr>";
 echo "<td>" . $row['platform_name'] . "</td>";
 echo "<td><input name='id[]' type='hidden' value='".$row['id']."' /><input name='id_acc_ref[]' type='hidden' value='".$row['id_acc_ref']."' /><input name='platform_type[]' type='hidden' value='".$row['platform_type']."' /><input name='platform_name[]' type='hidden' value='".$row['platform_name']."' />Every <input id='scan_freq1' name='scan_freq1[]' type='number' style='width:50px;text-align:center' min='0' max='256' value='".$row['scan_frequency']."' placeholder='0000-00-00' /> week(s)</td>";
 echo "<td><input type='text' class='datepicker' name='first_scan_date1[]' style='text-align:center' value='".$row['first_scan_date']."' placeholder='0000-00-00' /></td>";
 echo "<td><input id='next_scan_date1' name='next_scan_date1[]' type='text' readonly='readonly' style='text-align:center' placeholder='".$row['next_scan_date']."' /></td>";
 echo "<td style='text-align:center'><img src='../images/ok.gif' id='save_conf1'></td>";
 echo "</tr>"; 

As you know, they're all arrays, that depends of the numbers of elements in the database. I've got some simple code, getting the result from the database and based on them, I'd like to make images visible in scope of that form (that submit button covers).

function test(resp)
  {
    if (resp == 1) 
    {
        document.getElementById('save_conf1').style.visibility = 'visible';
    }

But it does visible's me after update just the first element (image), no matter which I select, any ideas how to populate it for all?

Thanks in advice.

Answer 1

If each <img src=...> has a unique id ( id='save_conf1' , id='save_conf2' , id='save_conf3' , etc. ) you can use a for loop -

function test(resp)
  {
    if (resp == 1) 
    {
        var max = ... //total number of <img src=...> with id='save_conf#'
        for (var i=1;i<=max;i++)
        { 
        document.getElementById('save_conf'+i).style.visibility = 'visible';
        }
    }

Another way to do it would be to use class and getElementByClassName .
ie. <img src=... class='save_conf'>

function test(resp)
  {
    if (resp == 1) 
    {
        document.getElementByClassName('save_conf').style.visibility = 'visible';

    }

Using getElementByClassName works on most modern browsers, but not on IE < 8. see also - stackoverflow.com/questions/1933602/how-to-getelementbyclass-instead-of-getelementbyid-with-javascript