Como adicionar validação no Jquery steps wizard

[Lincoln Ferreira 0]

Eu estou tentando fazer um Jquery steps wizard mas não consigo colocar pra ele parar caso não tenha sido preenchido o formulario no segundo passo.

http://www.jquery-steps.com/Examples

 

     if (newIndex === 2 && $("#Rua").val() == "") {
        return false;
     }
    
    $(document).ready(function() {   
    
      $("#wizard").steps({
    
          headerTag: "h2",
          bodyTag: "section",
          transitionEffect: "slideLeft",
          stepsOrientation: "vertical",
          labels: {
            current: "current step:",
            pagination: "Pagination",
            finish: "Finalizar",
            next: "Confirmar",
            previous: "Voltar",
            loading: "Carregando ..."
          },
          onStepChanging: function(event, currentIndex, newIndex, cepError) {
            if (currentIndex > newIndex) {
              return true;
            }
    
            if (newIndex === 1) {
              return true;
            }
    
            if (newIndex === 2 && $("#Rua").val() == "") {
    
              return false;
            }
    
          }
        }
    
      )
    });
        

     <div id="wizard">
            <h2>Verificação pedido</h2>
            <section>
                <h2><strong>Pedido:</strong></h2>

                <div class="lista-carrinho"></div>

            </section>

            <h2>Local de entrega</h2>
            <section>
                <div class="informações-usuario">

                    <form method="get" action="." id="#form-cep">
                        <div class="form-row">
                            <div class="form-group col-md-6">
                                <label for="cep">Cep:</label>
                                <input name="cep" type="text" class="form-control" id="cep" placeholder="09572-660" value="" size="10" maxlength="9" required>
                            </div>
                            <div class="form-row">
                                <div class="form-group col-md-6">
                                    <label for="rua">Rua:</label>
                                    <input name="rua" class="form-control" type="text" id="rua" placeholder="Sete de Dezembro" size="60" maxlength="" />
                                </div>
                            </div>
                            <div class="form-row">
                                <div class="form-group col-md-6">
                                    <label for="bairro">Bairro:</label>
                                    <input name="bairro" class="form-control" type="text" placeholder="Nova Gerty" id="bairro" size="40" maxlength="40" />
                                </div>
                            </div>
                            <div class="form-row">
                                <div class="form-group col-md-6">
                                    <label for="n">N°:</label>
                                    <input name="n" class="form-control" type="text" placeholder="2" id="n" size="6" maxlength="10" />
                                </div>
                            </div>
                            <div class="form-group col-md-6">
                                <label for="complemento">Complemento:</label>
                                <input name="complemento" type="text" class="form-control" id="complemento" placeholder="Ao lado do extra" value="" size="10" maxlength="9" requerid>
                            </div>
                            <div class="form-row">
                                <div class="form-group col-md-11">
                                    <label for="cidade">Cidade:</label>
                                    <input name="cidade" class="form-control" type="text" placeholder="São Bernardo do Carpo" id="cidade" size="40" maxlength="40" />
                                </div>
                            </div>


                        </div>
                    </form>
                </div>

            </section>

            <h2>Forma de pagamento</h2>
            <section>
                <div class="row d-flex justify-content-center col-sm col-md col-lg m-5 ">
                    <h2>Informe sua forma de pagamento :</h2>
                </div>
                <div class="row d-flex justify-content-center col-sm col-md col-lg m-5 ">

                    <div class="col-2">
                        <li class="list-inline-item">
                            <div class="pure-radiobutton">
                                <input id="Dinheiro" name="dinheiro" type="radio" class="radio">
                                <label for="Dinheiro">Dinheiro</label>
                            </div>
                        </li>
                    </div>
                    <div class="row">
                    
                    </div>
                    <div class="col-2">

                        <li class="list-inline-item">
                            <div class="pure-radiobutton">
                                <input id="Cartao" name="cartao" type="radio" class="radio">
                                <label for="Cartao">Cartão</label>
                            </div>
                        </li>
                    </div>
                </div>

            </section>

        </div>