Validate fields in a form made with jQuery-Steps

Question

The form has two Steps, I was able to validate the first step using the onStepChanging. But in the second step where there are fields that need to be validated, the user action becomes Submit, which I inform in onFinished. I then tried at the onFinished do the same validation I do on onStepChanging, but the variable is not populated using the val(); because the form has not yet been sent. How can I validate the fields?

$(function(){
    $("#form-total").steps({
        headerTag: "h2",
        bodyTag: "section",
        transitionEffect: "fade",
        enableAllSteps: true,
        autoFocus: true,
        transitionEffectSpeed: 700,
        titleTemplate : '<span class="title">#title#</span>',
        labels: {
            previous : 'Voltar',
            next : 'Próximo',
            finish : 'Enviar',
            current : ''
        },
        onStepChanging: function (event, currentIndex, newIndex) { 
            var nota = $('#nota').val();
            
            $('#nota-val').text('Sua no foi '+nota+'!');            
			
            //Valida se a nota foi preenchida
            if(nota == null){
                alert("Escolha uma nota!");
            return false;
            }

            return true;
},
    onFinished: function (event, currentIndex) {
                $("#form").submit();
    }
});
});

<form id="form" class="form-register" action="envia.php?at=<?echo $atendimento;?>" method="post">
	<div id="form-total">
		<!-- SECTION 1 -->
        <h2>1</h2>
        <section>		
            <div class="inner">
				<div class="form-row">
					<div class="form-holder">
						<select required class="form-control" name="nota" id="nota" required="">
							<option value="" disabled selected>Escolha uma nota</option>
							<option value="10">10</option>
							<option value="9">9</option>
							<option value="8">8</option>
							<option value="7">7</option>
							<option value="6">6</option>
							<option value="5">5</option>
							<option value="4">4</option>
							<option value="3">3</option>
							<option value="2">2</option>
							<option value="1">1</option>
							<option value="0">0</option>
						</select>
					</div>
				</div>
			</div>
        </section>
        <!-- SECTION 2 -->
        <h2>2</h2>
        <section>
            <div class="inner">
				<div class="form-row">
					<div class="form-holder shadow-textarea">
					<div id="nota-val"></div><br><div id="pergunta-val"></div><br>
					<select name="classificacao[]" id="classificacao[]" class="mdb-select md-form" multiple>									
							<option value="" disabled selected>Escolha</option>											
							 <? while (($exibe = oci_fetch_array($parsed_classif, OCI_ASSOC+OCI_RETURN_NULLS)) != false) {
                                $NR_SEQUENCIA 		= $exibe ['NR_SEQUENCIA'];
                                $DS_CLASSIFICACAO 	= $exibe ['DS_CLASSIFICACAO'];
                            ?>
                            <option value="<?=$NR_SEQUENCIA?>"><?=$DS_CLASSIFICACAO?></option>
                            <? } ?>
						</select>
						<!--<br><br><textarea class="form-control z-depth-1" id="justificativa" placeholder="Justifique" style="width:300px;" ></textarea>-->
						<br><br><input type="text" id="justificativa" name="justificativa" placeholder="Justifique" class="form-control">
					</div>								
				</div>
			</div>
        </section>
	</div>
</form>

Answer 1

In Validation the value is coming empty and not null,

change to

if(nota == null || nota ==''){

See in the code below:

$(function(){
    $("#form-total").steps({
        headerTag: "h2",
        bodyTag: "section",
        transitionEffect: "fade",
        enableAllSteps: true,
        autoFocus: true,
        transitionEffectSpeed: 700,
        titleTemplate : '<span class="title">#title#</span>',
        labels: {
            previous : 'Voltar',
            next : 'Próximo',
            finish : 'Enviar',
            current : ''
        },
        onStepChanging: function (event, currentIndex, newIndex) { 
            var nota = $('#nota').val();
            
            $('#nota-val').text('Sua no foi '+nota+'!');            
			       
            //Valida se a nota foi preenchida
            if(nota == null || nota ==''){
                alert("Escolha uma nota!");
            return false;
            }

            return true;
},
    onFinished: function (event, currentIndex) {
                $("#form").submit();
    }
});
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.7/jquery.min.js"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-steps/1.1.0/jquery.steps.js"></script>

<form id="form" class="form-register" action="envia.php?at=<?echo $atendimento;?>" method="post">
	<div id="form-total">
		<!-- SECTION 1 -->
        <h2>1</h2>
        <section>		
            <div class="inner">
				<div class="form-row">
					<div class="form-holder">
						<select required class="form-control" name="nota" id="nota" required="">
							<option value="" disabled selected>Escolha uma nota</option>
							<option value="10">10</option>
							<option value="9">9</option>
							<option value="8">8</option>
							<option value="7">7</option>
							<option value="6">6</option>
							<option value="5">5</option>
							<option value="4">4</option>
							<option value="3">3</option>
							<option value="2">2</option>
							<option value="1">1</option>
							<option value="0">0</option>
						</select>
					</div>
				</div>
			</div>
        </section>
        <!-- SECTION 2 -->
        <h2>2</h2>
        <section>
            <div class="inner">
				<div class="form-row">
					<div class="form-holder shadow-textarea">
					<div id="nota-val"></div><br><div id="pergunta-val"></div><br>
					<select name="classificacao[]" id="classificacao[]" class="mdb-select md-form" multiple>									
							<option value="" disabled selected>Escolha</option>											
							 <? while (($exibe = oci_fetch_array($parsed_classif, OCI_ASSOC+OCI_RETURN_NULLS)) != false) {
                                $NR_SEQUENCIA 		= $exibe ['NR_SEQUENCIA'];
                                $DS_CLASSIFICACAO 	= $exibe ['DS_CLASSIFICACAO'];
                            ?>
                            <option value="<?=$NR_SEQUENCIA?>"><?=$DS_CLASSIFICACAO?></option>
                            <? } ?>
						</select>
						<!--<br><br><textarea class="form-control z-depth-1" id="justificativa" placeholder="Justifique" style="width:300px;" ></textarea>-->
						<br><br><input type="text" id="justificativa" name="justificativa" placeholder="Justifique" class="form-control">
					</div>								
				</div>
			</div>
        </section>
	</div>
</form>