AnsweredAssumed Answered

on Change select drop down 1st value by default

Question asked by AlexSabrina on Nov 3, 2015
Latest reply on Nov 3, 2015 by thejus.kambi

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>

Outcomes