dropdown select to go url not working in while loop php

Question

  <?php
    $sql = "select * from letter where societyn='" . $_SESSION['socityname'] ."' ";
    $result = mysql_query($sql);
    $i=1;
    while($row=mysql_fetch_array($result)){         
?>
<?php
    $id = $row['id'];
    $dater = $row['date'];
    $flatnonam = $row['flatno_name'];
    $addr = $row['adress'];
    $subject = $row['subject'];
    $body = $row['body'];
    $soci = $row['societyn'];
    $refnum = $row['refno'];
    $letterh = $row['letterh'];

        // split "dd-mm-yyyy" into an array of three elements
        $ddate = explode("-", $dater);
        // retrieve the values
        $month = $ddate[1]; // mm
        $day = $ddate[2]; // dd
        $year = $ddate[0]; // yyyy
    {
    ?>

<tr>
            <td><?php echo $day.'/'.$month.'/'.$year; ?></td>
            <td><?php echo $flatnonam; ?></td>
            <td><?php echo $letterh; ?></td>
            <td><?php echo $addr; ?></td>
            <td><?php echo $subject; ?></td>
            <td><?php echo $soci; ?></td>
            <td><?php echo '#'.$refnum; ?></td>

            <td>
            <select name="menu1" id="menu1">
                <option value="" selected>Pick a Website</option>
                <option value="letter/letter_print.php?id=<?php echo $row['id']; ?>">Without Letter Head</option>
                <option value="letter/letter_print_nohead.php?id=<?php echo $row['id']; ?>">Letter Head</option>
            </select>
            </td></tr>

    <?php }?>
    <?php
    echo "<br>";
    $i++;
    }

    ?>


<!--This is java script-->
<script type="text/javascript">
 var urlmenu = document.getElementById( 'menu1' );
 urlmenu.onchange = function() {
      window.open( this.options[ this.selectedIndex ].value, '_blank','width=595,height=842,directories=no,titlebar=no,toolbar=no,location=no,status=no,menubar=no,scrollbars=no,resizable=no');
 };
</script>

This is my code .only 1st one option working other not working. please help i am in trouble. from 2 days. or give another solution. In one id how to use all options. I was trying from 2 days its not working.

Answer 1

As mentioned change your id to class since you have multiple select. Then define onchange listener for all of them:

var urlmenus = document.querySelectorAll('.menu1');
for(var i = 0; i < urlmenus.length; i++) {
    urlmenus[i].onchange = function () {
        window.open(this.options[this.selectedIndex].value, '_blank', 'width=595,height=842,directories=no,titlebar=no,toolbar=no,location=no,status=no,menubar=no,scrollbars=no,resizable=no');
    };
}

jsfiddle DEMO