JSFiddle - React, Tailwind, and code Playground
by Amandeep Singh
HTML
<form id="order">
<select>
<option value="">--please select--</option>
<option value="12">option1</option>
<option value="13">option2</option>
</select> <br><br>
<select>
<option value="">--please select--</option>
<option value="12">option1</option>
<option value="13">option2</option>
</select> <br><br>
<select>
<option value="">--please select--</option>
<option value="12">option1</option>
<option value="13">option2</option>
</select> <br><br>
<select class="second">
<option value="">--please select--</option>
<option value="12">option1</option>
<option value="13">option2</option>
</select> <br><br>
<input type="text" value=""><br><br>
<input type="text" value=""><br><br>
<input type="text" value=""><br><br>
<input type="text" value=""><br><br>
<input type="checkbox" value="somevalue">
<input type="checkbox" value="somevalue">
<input type="checkbox" value="somevalue"><br>
<input type="submit" value="submit" name="submit" id="submit" disabled>
</form>
JavaScript
var orderText = $('#order input[type="text"]');
var orderCheck = $('#order :checkbox');
var orderSelect = $('#order select').not('#sel_option_img');
var enableOrDisableSubmit = function() {
var textEntered = $(orderText).filter(function(){
return $(this).val() != '';}).length > 0; // here filter method is added for textboxes
var orderChecked = orderCheck.not('.others').is(':checked');
var orderSelected = $(orderSelect).filter(function(){
return $(this).val() != '';}).length > 0; // here filter method is added for select
if (textEntered || orderChecked || orderSelected)
$('#submit').prop('disabled', false);
else
$('#submit').prop('disabled', true);
};
orderText.change(enableOrDisableSubmit);
orderCheck.change(enableOrDisableSubmit);
orderSelect.change(enableOrDisableSubmit);