0

Exemplo :

$("#segundaFeira").change(function(){
        valorSegundaFeira = calcularJornadaDeTrabalho(this.value);
        var x = valorFinalJornadaTrabalho();
        alert(x);
});

Perceba que a variável global valorSegundaFeira é definida por uma função que retorna um valor. até ai tudo bem o problema que quando eu chamo change está printando o alert(x) primeiro para depois entrar na funcão calcularJornadaDeTrabalho e definir o valor de valorSegundaFeira. Não sei porque não está seguindo o algoritmo estruturado.

Código HTML

<select class="form-control" th:field="*{segundaFeira}" >
                option value="" selected="selected">--</option>
                <option th:each="horario : ${listaHorarioTrabalhoDiario}" th:value="${horario.id}"
                                            th:text="${horario.descricao}">horario</option>
</select>

Função calcularJornadaDeTrabalho

function calcularJornadaDeTrabalho(value){
        var **= 440;
        var **= 528;
        var **= 480;
        var **= 540;
        var **= 480;
        var **= 240;
        var **= 360;
        var valorTotal = 0;
        var **= 0;

        $.get(urlJornadaTrabalho, {idHorario: value}).done(function (horario) {
            **= horario.**; 
            if (**== '**') {
                valorTotal = **;
            }
            if (**== '**') {
                valorTotal = **;
            }
            if (**== '**') {
                valorTotal = **;
            }
            if (**== '**') {
                valorTotal = **;
            }
            if (**== '**') {
                valorTotal = **;
            }
            if (**== '**') {
                valorTotal = **;
            }
            if (**== '**') {
                valorTotal = **;
            }
            alert("vlrTotal " + valorTotal);
        }).fail(function(xhr) {
            console.log("erro ao fazer ajax na urlJornadaTrabalho");
        });
        return valorTotal;
    }
11
  • Poderia por favor nos mostrar o HTML também? Commented 5/11/2015 às 12:42
  • Posta a calcularJornadaDeTrabalho() também. Commented 5/11/2015 às 12:44
  • ok só um momento Commented 5/11/2015 às 12:44
  • pronto já fiz as edições Commented 5/11/2015 às 12:55
  • você usa algum framework/library js sem ser o jquery ? Commented 5/11/2015 às 12:57

3 Respostas 3

2

A resposta do @flpms já responde o motivo de isso não funcionar, você está trabalhando com promises e antes de aguardar o retorno da requisição e a promise ser resolvida você já retorna a variaval que ainda está sem o valor do calculo.

Tenta a seguinte solução:

$("#segundaFeira").change(function() {
  calcularJornadaDeTrabalho(this.value).done(function(varloRetornadoPromise) {
    valorSegundaFeira = varloRetornadoPromise;
    var x = valorFinalJornadaTrabalho();
    alert(x);
  }).fail(function(error) {
    console.dir(error);
  });

});

function calcularJornadaDeTrabalho(value) {
  var * *= 440;
  var * *= 528;
  var * *= 480;
  var * *= 540;
  var * *= 480;
  var * *= 240;
  var * *= 360;
  var valorTotal = 0;
  var * *= 0;

  return $.get(urlJornadaTrabalho, {
    idHorario: value
  }).done(function(horario) { * *= horario.* * ;
    if ( * *= = '**') {
      valorTotal = * * ;
    }
    if ( * *= = '**') {
      valorTotal = * * ;
    }
    if ( * *= = '**') {
      valorTotal = * * ;
    }
    if ( * *= = '**') {
      valorTotal = * * ;
    }
    if ( * *= = '**') {
      valorTotal = * * ;
    }
    if ( * *= = '**') {
      valorTotal = * * ;
    }
    if ( * *= = '**') {
      valorTotal = * * ;
    }

    return valorTotal;
  }).fail(function(xhr) {
    return "erro ao fazer ajax na urlJornadaTrabalho";
  });

}

Recomendo um pouco de estudo sobre promises e suas implementações no javascript para que possa entender perfeitamente o fluxo do código acima.

1
  • Esqueci da abordagem da Promisses, fiquei tão focado em explicar o motivo que esqueci dessa mão na roda.
    – flpms
    Commented 5/11/2015 às 17:03
1

O seu problema está na parte assíncrona do Javascript.

Quando ocorre o evento change a função calcularJornadaDeTrabalho não completou a execução. Então a variável valorSegundaFeira está undefined.

Sugestão é que você corrija a execução de escopo global e no callback do evento change você chame a ação que preencha a variável valorSegundaFeira com a informação que você deseja.

Você pode passar a função valorFinalJornadaTrabalho como callback, no final da chamada da calcularJornadaDeTrabalho. A chamada ficaria assim:

calcularJornadaDeTrabalho(value, valorFinalJornadaTrabalho) {
    //Após o sucesso do AJAX
    valorFinalJornadaTrabalho(valores);
}

O Javascript é diferente das outras linguagens, ele não tem uma execução passo a passo, ele pode executar um AJAX enquanto você nem tem a resposta ainda executar a soma dos valores. Então para garantir a execução passo a passo você usa o callback, a ação que deve ser chamada após o termino da execução anterior.

0

Sua chamada GET está rodando sincronicamente e até ter seu resultado as funções subsequentes já foram executadas.

Sugiro que utilize a chamada GET da seguinte maneira (async false):

$.ajax({
    url : urlJornadaTrabalho,
    type : "get",
    async: false,
    data: {idHorario: value},
    success : function(horario) {
        * *= horario.* * ;
    if ( * *= = '**') {
      valorTotal = * * ;
    }
    if ( * *= = '**') {
      valorTotal = * * ;
    }
    if ( * *= = '**') {
      valorTotal = * * ;
    }
    if ( * *= = '**') {
      valorTotal = * * ;
    }
    if ( * *= = '**') {
      valorTotal = * * ;
    }
    if ( * *= = '**') {
      valorTotal = * * ;
    }
    if ( * *= = '**') {
      valorTotal = * * ;
    }

    return valorTotal;
    },
    error: function() {
       return "erro ao fazer ajax na urlJornadaTrabalho";
    }
 });
1
  • Eu não recomendaria essa abordagem @Iago. Você bloqueia qualquer outra ação do usuário durante a request. As abordagens com promises ou usando o callback no geral são melhores, por não causar o bloqueio.
    – flpms
    Commented 5/11/2015 às 17:05

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .