jQuery find option in Select with empty/null value remove it and select the first option after it with a value
you can use .filter() to filter out the empty option elements and remove them all at once
use .prop() to set special attributes like
selected
Code:
$('select option')
.filter(function() {
return !this.value || $.trim(this.value).length == 0;
})
.remove();
$('select option')
.first()
.prop('selected', true);
DEMO
Check if selected dropdown value is empty using jQuery
You forgot the #
on the id selector:
if ($("#EventStartTimeMin").val() === "") {
// ...
}
How to check all select option value is not an empty?
I think that a much simpler solution is to count the number of empty values you have within the .selectmenu
elements:
$('.selectmenu').filter(function(){return $(this).val() == ''}).length
Here is a working snippet:
function selectValidation() { var emptyvalues = $('.selectmenu').filter(function(){return $(this).val() == ''}).length; if (emptyvalues) { return false; } return true;}
$('#btn').click(function() { console.log($('.selectmenu').filter(function(){return $(this).val() == ''}).length)});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><form name="selectForm" action="" onSubmit="return selectValidation();" method="POST"> <div> <select class="selectmenu"> <option value="">Select the value</option> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> <option value="5">5</option> <option value="6">6</option> <option value="7">7</option> <option value="8">8</option> <option value="9">9</option> <option value="10">10</option> </select> </div> <div> <select class="selectmenu"> <option value="">Select the value</option> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> <option value="5">5</option> <option value="6">6</option> <option value="7">7</option> <option value="8">8</option> <option value="9">9</option> <option value="10">10</option> </select> </div> <div> <select class="selectmenu"> <option value="">Select the value</option> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> <option value="5">5</option> <option value="6">6</option> <option value="7">7</option> <option value="8">8</option> <option value="9">9</option> <option value="10">10</option> </select> </div> <div> <select class="selectmenu"> <option value="">Select the value</option> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> <option value="5">5</option> <option value="6">6</option> <option value="7">7</option> <option value="8">8</option> <option value="9">9</option> <option value="10">10</option> </select> </div> <div> <select class="selectmenu"> <option value="">Select the value</option> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> <option value="5">5</option> <option value="6">6</option> <option value="7">7</option> <option value="8">8</option> <option value="9">9</option> <option value="10">10</option> </select> </div> <div> <button type="submit" class="btn"> <i class="fa fa-btn fa-user"></i> Submit Answers </button> </div> </form><br /><br /><button id="btn">count empty</button>
How to check whether a select box is empty using JQuery/Javascript
To check whether select box has any values:
if( $('#fruit_name').has('option').length > 0 ) {
To check whether selected value is empty:
if( !$('#fruit_name').val() ) {
jQuery set select box to empty option
Add $('#select2').val('')
at the last of select1
's change event like following.
$("#select1").change(function () {
$('.quantity').val('');
$('#trblock').fadeIn();
if ($(this).data('options') == undefined) {
$(this).data('options', $('#select2 option').clone());
}
var id = $(this).val();
var options = $(this).data('options').filter('[value=' + id + ']');
$('#select2').html('<option value="">').append(options);
$('#select2').val(''); //add this line
});
Best way (with jQuery) to check that an empty <option> is not selected
I have used this:
$("#mySelect").change(function(){
if(!$("#mySelect option:selected").is('[value]'))
console.log('no value');
});
Working http://jsfiddle.net/5ht7g/
alert if option value is empty using jquery
you can use the .val
property
if( $('#category').val() === '' )
Check Fiddle
All Select list options with a class and value not blank using jQuery
Maybe like this:
if(!$('#ShowTimeList option[value!=""]').not('.timeSoldOut').length){ alert('Time is over');}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<select name="TimesSelect" id="ShowTimeList"> <option value="">Choose a Time</option> <option value="208292" disabled="disabled" class="timeSoldOut">10:50 AM - SOLD OUT</option> <option value="208464" disabled="disabled" class="timeSoldOut">11:00 AM - SOLD OUT</option> <option value="208636" disabled="disabled" class="timeSoldOut">11:10 AM - SOLD OUT</option> <option value="208808" disabled="disabled" class="timeSoldOut">11:20 AM - SOLD OUT</option> </select>
Related Topics
How to Hide the Android Keyboard Using JavaScript
Res.Sendfile in Node Express With Passing Data Along
How to Hide and Show Div by Id Based on the Value of Selected Drop Down -Jquery and JavaScript
How to Access Variables from Another File
Javascript: Get All Months Between Two Dates
How to Include a JavaScript in a Jsp Page
How to Check If a Background Image Is Loaded
Callback Is Not a Function (But It Is)
How to Check If Checkbox Is Checked With Protractor, Cucumberjs and Chai
Regexp to Validate a Non-Zero Number
Innerhtml Inserts Only [Object Htmldivelement]
Reload Datatable After Ajax Success
Setting Iframe Height to Scrollheight in Reactjs
React Setstate Not Updating State and Ui
React History.Push() Not Rendering New Component