CODEWITHSUNDEEP
javascript
nubteens
nubteens

Reputation: 6148

Setting first visible option as default

I have a filter method that whenever a date and time is changed, the function checkRoom(); is called. This function basically filters some options which is completely working. My problem now is that even though the option is filtered, the filtered value is still the now showing on top. Now, how can I set the first visible option as default value?

I have tried using these both these codes but it is not working. document.getElementById("room4").value = ('option:visible').first().attr('selected', 'selected'); 

jQuery(".roomss option:first-child:visible").attr("selected", true);

Html:

<select name="room4" id="room4" class="roomss form-control placeholder-no-fix" style="display: inline; width: 30%;">
    <option value="1" class="roomnumber1">1</option>
    <option value="2" class="roomnumber2">2</option>
    <option value="3" class="roomnumber3">3</option>
    <option value="4" class="roomnumber4">4</option>
    <option value="5" class="roomnumber5">5</option>
    <option value="6" class="roomnumber6">6</option>
</select>

Javascript:

        function checkRoom() {
            var date = document.getElementById("date4").value;
            var time = document.getElementById("time4").value;
            var str = date + " " + time + ":00.0";
            $('option.roomnumber1').show();
            $('option.roomnumber2').show();
            $('option.roomnumber3').show();
            $('option.roomnumber4').show();
            $('option.roomnumber5').show();
            $('option.roomnumber6').show();
            for(var i = 0; i < orderids.length; i++) {
                if(str === scheduledates[i]) {
                    if(rooms[i] !== "null") {
                        $('option.roomnumber' + rooms[i]).hide();
                    }
                }
            }
            // insert code that sets first visible option as default value
        }

Upvotes: 0

Views: 1145

Answers (1)

Brij
Brij

Reputation: 6122

try following:

$(".roomss option:visible:first").attr("selected", "selected");

for new version of jQuery

$(".roomss option:visible:first").prop("selected", "selected");

Upvotes: 2

Related Questions