Features / Usability

<div class="row"><div class="col-sm-3">
	{* add dropdown for months and year from May 1st*}
	<select id="daterange-presets" class="form-control">
		<option value=""></option>
		<option value="year">{tr}Financial Year To Date{/tr}</option>
		<option value="1">{tr}January{/tr}</option>
		<option value="2">{tr}February{/tr}</option>
		<option value="3">{tr}March{/tr}</option>
		<option value="4">{tr}April{/tr}</option>
		<option value="5">{tr}May{/tr}</option>
		<option value="6">{tr}June{/tr}</option>
		<option value="7">{tr}July{/tr}</option>
		<option value="8">{tr}August{/tr}</option>
		<option value="9">{tr}September{/tr}</option>
		<option value="10">{tr}October{/tr}</option>
		<option value="11">{tr}November{/tr}</option>
		<option value="12">{tr}December{/tr}</option>
	</select>
</div>
<div class="col-sm-5">
	{daterange _field="date" id="date" _to="now" _gap="30 days" class="form-control"}
</div></div>

$("#daterange-presets").change(function () {
		var val = $(this).val(),
			$from = $("#date_from_dptxt"),
			$to = $("#date_to_dptxt"),
			now = new Date(),
			year = now.getFullYear(),
			month = now.getMonth();

		if (val === "year") {
			if (month < 5) {
				year--;
			}
			$from.datepicker("setDate", "1/05/" + year).change();
			$to.datepicker("setDate", now).change();
		} else {
			val = parseInt(val);

			if (month < val) {
				year--;
			}

			$from.datepicker("setDate", "1/" + val + "/" + year).change();
			if (val === 12) {
				val = 0;
				year++;
			}
			$to.datepicker("setDate", "1/" + (val + 1) + "/" + year).change();
		}
		$("table#wpcs-0").find("th:first-child").trigger("sort");
		$('#customsearch_0').submit();
	});