Hi all, I am trying to get a UI that allows users to select Measurement values from a drop down menu. I have some code that works great but I have to first manually select from drop down otherwise I get an "undefined" value. I would like that if nothing is selected in drop down by user then it automatically uses the first value in drop down. Any idea why?
1) This how I change selected values in my drop down:
var areasUnits;
var areasUnitsText;
var LenghtUnits;
var LenghtUnitsText;
$('#Area').on('change', function () {
areasUnits = $(this).val();
areasUnitsText = $(this).find("option:selected").text();
alert(this.value)
});
$('#Length').on('change', function () {
LenghtUnits = $(this).val();
LenghtUnitsText = $(this).find("option:selected").text();
});2) This is my drop downs:
<select id="Area" class="form-control">
<option value="UNIT_ACRES">Acres</option>
<option value="UNIT_SQUARE_MILES">Square Miles</option>
<option value="UNIT_ARES">Ares</option>
<option value="UNIT_HECTARES">hectares</option>
<option value="UNIT_SQUARE_FEET">Square Feet</option>
<option value="UNIT_SQUARE_KILOMETERS">Square Kilometers</option>
<option value="UNIT_SQUARE_METERS">Square Meters</option>
</select>
<div style=" width: 100%; border: solid; padding: 10px;"><span style="font-weight:bolder;">Results:</span> <span style="font-weight:bolder;" id="area"></span></div>
<br />
<p style=" font-style: italic; font-weight: bold; color:red;">Polylines</p>
<select id="Length" class="form-control">
<option value="UNIT_FOOT">Feet</option>
<option value="UNIT_KILOMETER">Kilometer</option>
<option value="UNIT_METER">Meter</option>
<option value="UNIT_STATUTE_MILE">Mile</option>
</select>
