Forms and submit in Laravel Blade

My web app handles info on semesters. The info on this semesters can be displayed on a table, exported as pdf and exported as csv.

My idea is to have one dropdown (semantic ui) from which the users selects the semester (which updates the table on click), and then clicks one of those two export buttons.

I'm struggling with the code and whats the best way to do this.

This is what I have now:

My dropdown (semantic ui)

<div class="ui selection dropdown">
<input id="semester" name="semester" type="hidden">
    <div class="default text">All semesters</div>
    <i class="dropdown icon"></i>
    <div class="menu">
        <div class="item" data-value="">Semester</div>
            @foreach($semesters as $semester)
                <div class="item" data-value="<?php echo $semester->id ?> ">
                <a href="{{ url('match/semester/' . $semester->name) }}">{{ $semester->name }}</a>
                </div>
            @endforeach
        </div>
   </div>

For each of the two buttons I created an extra form with a hidden field which is updated to the selected semester using javascript.

{!! Form::open(array('url' => 'match/pdf')) !!}
    {{ Form::hidden('semester_pdf', $semester) }}
    {!! Form::submit('PDF', ['class' => 'btn btn-success tn-sm']) !!}
{!! Form::close() !!}

{!! Form::open(array('url' => 'match/csv')) !!}
    {{ Form::hidden('semester_csv', $semester) }}
    {!! Form::submit('CSV', ['class' => 'btn btn-success tn-sm']) !!}
{!! Form::close() !!}

and the javascript which udpates the value of the hidden fields:

<script>
    function myFunction(){
        document.getElementById("semester_pdf").value = "WS2016";
    }
</script>

I'm pretty sure I'm not doing this the right way.

Any help?