<h2 class="page-header">Search Event</h2>
<form action="/events" method="GET">
    <div class="form-row">
        <div class="form-item">
            <label>Name</label>
            <input type="text" name="name" value="<%= searchOptions.name %>">
        </div>
        <div class="form-item">
            <label>Type</label>
            <select name="type">
                <option value=""></option>
                <option value="Seminar">Seminar</option>
                <option value="Exhibition">Exhibition</option>
            </select>
        </div>
    </div>

    <div class="form-row">
        <div class="form-item">
            <label>Start After</label>
            <input type="datetime-local" name="startAfter" value="<%= searchOptions.startAfter %>">
        </div>
        <div class="form-item">
            <label>End Before</label>
            <input type="datetime-local" name="endBefore" value="<%= searchOptions.endBefore %>">
        </div>
    </div>

    <div class="form-row form-row-end btn-row">
        <button class = "btn btn-primary"
        type="submit">Search</button>
    </div>
</form>
<br>
<%- include('../partials/eventGrid', { events: events, large:true }) %>