return SELECT value

return SELECT value

by Robert Barros

HTML

<h3>Progress Form</h3>
<div class="progress-wrap">
  <progress max="100" value="0" id="progress"></progress>
  <div class="progress-message" id="progress-message">The form, it wants you.</div>
</div>
<br/>
<input type="text" value="" /><br/>
<input type="text" value="" /><br/>
<input type="text" value="" /><br/>

<select class="make">
  <option disabled selected value>select an option</option>
  <option value="999" selected>Select 2</option>  
  <option value="20">Select 2</option>  
</select>
<br/>
<input type="text" value="dfgd" /><br/>
<input type="text" value="dfgdf" /><br/>

<select class="model">
  <option disabled selected value>select an option</option>
  <option value="30">Select 1</option>
  <option value="40" selected>Select 2</option>
</select>

CSS

#ProgressBar {
  width: 100%;
  background-color: #ddd;
}

.progressCompleted {
  width: 10%;
  height: 30px;
  background-color: #4CAF50;
  text-align: center;
  line-height: 30px;
  color: white;
}

JavaScript

var total = 7;
var numInput = $('input:text').filter(function() { return !$(this).val() == ""; });
var cMake = $(".make").val();
var cModel = $(".model").val();
var drops = 0;
temp = 0;

if(cMake) {	drops++;}
if(cModel) {	drops++;}

total = ( 7 - (numInput.length+drops) );

alert(total);