Javascript function Only works once (PHP file)

Question

<table class="blueTable">
    <thead>
    <tr>
        <th>kopieer</th>
        <th>Dag</th>
        <th>Openings tijd</th>
        <th>Sluitings tijd</th>
    </tr>
    </thead>
    <tbody>
    <?php $dagen = array("Maandag", "Dinsdag", "Woensdag", "Donderdag", "Vrijdag", "Zaterdag", "Zondag");
    
    foreach ($dagen as $dag) { ?>
        <tr>
            <td>
                <select name="<?= $dag; ?>_kopie" id="<?= $dag; ?>_kopie" onchange="kopie('<?= $dag; ?>');">
                    <option value=""></option>
                    <?php foreach ($dagen as $day) { ?>
                        <option value="<?= $day; ?>"><?= $day; ?></option>
                    <?php } ?>
                </select>
            </td>
            <td><b><?= $dag; ?></b></td>
            <td>
                <?php GetalDropDown(0, 23, $dag . "_open_uur", @$_POST[$dag . "_open_uur"], $_POST[$dag . "_open_uur"], TRUE); ?>:
                <?php GetalDropDown(0, 59, $dag . "_open_minuut", @$_POST[$dag . "_open_minuut"], $_POST[$dag . "_open_minuut"], TRUE); ?>
            </td>
            <td>
                <?php GetalDropDown(0, 23, $dag . "_sluit_uur", @$_POST[$dag . "_sluit_uur"], $_POST[$dag . "_sluit_uur"], TRUE); ?>:
                <?php GetalDropDown(0, 59, $dag . "_sluit_minuut", @$_POST[$dag . "_sluit_minuut"], $_POST[$dag . "_sluit_minuut"], TRUE); ?>
            </td>
        </tr>
        <?php
    }
    ?>
    </tbody>
</table>

<script language="JavaScript">

    function kopie(dag) {
        kopie = dag + "_kopie";
        nieuwe_dag_waarden = document.getElementById(kopie).value;

        array = ["_open_uur", "_open_minuut", "_sluit_uur", "_sluit_minuut"];

        for (index = 0; index < array.length; index++) {
            oud = dag + array[index];
            nieuw = nieuwe_dag_waarden + array[index];
            document.getElementById(oud).value = document.getElementById(nieuw).value;
        }

        document.getElementById(kopie).value = "";
    }

</script>

The first time i change one of the onchange dropdowns it works fine but after that the function doesnt fire at all anymore on any of the onchange dropdowns.

the function changes the openings and sluitings tijd dropdowns to the values of whatever day you chose.

if you choose monday for tuesday, tuesday openings en closing values willl change to the values of monday.

function GetalDropDown($start, $eind, $naam, $selected, $current_value, $metnul=true) {

    echo "\t<select name=\"$naam\" id=\"$naam\" style=\"WIDTH: 65px\"\">\n";
    if ($selected == "") {
         $selected = $current_value;
    }

    echo "\t<option value=\"\" > - </option>\n";
    for ($i = $start; $i <= $eind; $i++) {
        $waarde = $i;
                   
        if (strlen($waarde) == 1 && $metnul == true) {
            $waarde = "0" . $waarde;
        }

        if (strcmp($waarde, $selected) == 0) {
            $aan = "SELECTED";
        } else {
            $aan = "";
        }
        echo "\t<option value=\"" . $waarde . "\" $aan>" . $waarde . "</option>\n";
    }

    echo "</select>\n";
}

Answer 1

I fixed it. I had to change the kopie function a bit. i still dont know what was the the problem but what i noticed is that the variables caused issues.

new kopie function:

function kopie(dag) {
     document.getElementById(dag + "_open_uur").value =  document.getElementById(document.getElementById(dag + "_kopie").value + "_open_uur").value;
     document.getElementById(dag + "_open_minuut").value =  document.getElementById(document.getElementById(dag + "_kopie").value + "_open_minuut").value;
     document.getElementById(dag + "_sluit_uur").value =  document.getElementById(document.getElementById(dag + "_kopie").value + "_sluit_uur").value;
     document.getElementById(dag + "_sluit_minuut").value =  document.getElementById(document.getElementById(dag + "_kopie").value + "_sluit_minuut").value;

     document.getElementById(dag + "_kopie").value = "";
}