Select an option on a Select tag and keep it there on reload/refresh

Question

I'm trying to make a Select tag in where after you choose and click an option from it, it will load to the href value that the option tag has. And after loading the option that you've selected will be the one highlighted on the select tag.

so far, from what I have searched I only have:

html:

    <select id="jumpid" onchange="jump(this)" >
        <option value="index.php?ID=1">Val 1</option>
        <option value="index.php?ID=2">Val 2</option>
        <option value="index.php?ID=3">Val 3</option>
        <option value="index.php?ID=4">Val 4</option>
        <option value="index.php?ID=5">Val 5</option>
        <option value="index.php?ID=6">Val 6</option>
        <option value="index.php?ID=7">Val 7</option>
    </select>

JS:

<script>
    function jump(selectedLink){
    var chpSelect = selectedLink.value;
    location.href=document.getElementById("jumpid").value;
}
</script>

When I select something for example Val 3 , the browser will reload to index.php?ID=3 and it's contents. But the select tag still shows Val 1 , I want it to stay to Val 3 .

Answer 1

It's crude but it'll work:

<?php
$id=0;
if(isset($_GET['ID']){
    $id = $_GET['ID'];
}
?>   

 <select id="jumpid" onchange="jump(this)" >
        <option value="index.php?ID=1" <?php if($id==1){echo "selected";}?>>Val 1</option>
        <option value="index.php?ID=2" <?php if($id==2){echo "selected";}?>>Val 2</option>
        <option value="index.php?ID=3" <?php if($id==3){echo "selected";}?>>Val 3</option>
        <option value="index.php?ID=4" <?php if($id==4){echo "selected";}?>>Val 4</option>
        <option value="index.php?ID=5" <?php if($id==5){echo "selected";}?>>Val 5</option>
        <option value="index.php?ID=6" <?php if($id==6){echo "selected";}?>>Val 6</option>
        <option value="index.php?ID=7" <?php if($id==7){echo "selected";}?>>Val 7</option>
    </select>