Ir para conteúdo
lucas70770

Estrutura condicional de forma dinamica com Jquery

Recommended Posts

Ola. Eu tenho um array com valores dinâmicos, esse valor é acrescentado a cada vez que o botão 'Adicionar Update'(que cria uma nova div com um progress bar referente ao input file da div) é usado. Cada div de update é  identificada desta forma: fr-arquivos0, fr-arquivos1fr-arquivos2 ... Quando clicar no botão submit quero que todas as divs de update sejam verificadas se o processo de update de cada uma foi concluída(100%).

 

 

Exemplo:

// OS VALORES DA VARIAVEL SÃO SOMENTE UM EXEMPLO POIS NA REALIDADE ELES SAO COLOCADOS DE FORMA DINAMICA
var verarray = [];
verarray = [0, 1, 2, 3];

$.each( verarray, function( nome, valor ){

  if( $('form[id=fr-arquivos'+valor+'] .progress-meter-text').text() == '100%' ) {
    alert('Todos updates foram Completos...');
  }

});

 

Obrigado pela atenção.

Compartilhar este post


Link para o post
Compartilhar em outros sites

Olá @lucas70770
Por favor esclareça o seguinte:
1-) Você cita: "cada DIV de update...."  e no código mostra:

form[id=fr-arquivos'+valor+']

 Afinal é DIV ou FORM?

2-) Existem vários tipos de progressbar, tais como: widget da jQueryUI, elemento PRGRESSBAR da HTML5 e outros.
Qual deles você está usando?

3-) O que é?

progress-meter-text').text()

 

  • +1 1

Compartilhar este post


Link para o post
Compartilhar em outros sites

Desculpe pela confusão na explicação. Na verdade não se trata de uma Div e sim de um Form. E o progress bar é html(é de um framework chamado Foundation Zurb: http://foundation.zurb.com/sites/docs/progress-bar.html):

<div class=".padding-none progress" role="progressbar" tabindex="0" aria-valuenow="50" aria-valuemin="0" aria-valuetext="50 percent" aria-valuemax="100">
  <span class="progress-meter" style="width: 0%">
    <p class="progress-meter-text"></p>
  </span>
</div>

 

Compartilhar este post


Link para o post
Compartilhar em outros sites

Agora você diz que se trata de um FORM:
" Desculpe pela confusão na explicação. Na verdade não se trata de uma Div e sim de um Form."
e mostra um DIV:

<div class=".padding-none progress" role="progressbar"

FORM ou DIV ?

 

class = ".padding-none progress"    .padding-none?  (tem um ponto no início do nome da classe???)

  • +1 1

Compartilhar este post


Link para o post
Compartilhar em outros sites

Sim.  Todos os progress bar que são criados são envolvidos por um form e identificados assim: fr-arquivos0, fr-arquivos1, fr-arquivos2 .

 

Exemplo:

<form action="post" class="form-arquivos" id="fr-arquivos0"  enctype="multipart/form-data">
  <div class=".padding-none progress" role="progressbar" tabindex="0" aria-valuenow="50" aria-valuemin="0" aria-valuetext="50 percent" aria-valuemax="100">
    <span class="progress-meter" style="width: 0%">
      <p class="progress-meter-text"></p>
    </span>
  </div>
</form>

<form action="post" class="form-arquivos" id="fr-arquivos1"  enctype="multipart/form-data">
  <div class=".padding-none progress" role="progressbar" tabindex="0" aria-valuenow="50" aria-valuemin="0" aria-valuetext="50 percent" aria-valuemax="100">
    <span class="progress-meter" style="width: 0%">
      <p class="progress-meter-text"></p>
    </span>
  </div>
</form>

<form action="post" class="form-arquivos" id="fr-arquivos2"  enctype="multipart/form-data">
  <div class=".padding-none progress" role="progressbar" tabindex="0" aria-valuenow="50" aria-valuemin="0" aria-valuetext="50 percent" aria-valuemax="100">
    <span class="progress-meter" style="width: 0%">
      <p class="progress-meter-text"></p>
    </span>
  </div>
</form>

 

Compartilhar este post


Link para o post
Compartilhar em outros sites

Oi Lucas,
No seu script se um dos updates for concluído o alert será disparado dando um FALSO POSITIVO.
Para corrigir criei uma variável para armazenar a quantidades de FORMS e outra para contar os FORMS com 100% dentro do FOR (em lugar do $each)
Compare as duas variáveis e se forem iguais TODOS os updates estarão concluídos.

Como mostrado a seguir:
 

<script type="text/javascript">
var qdeForms = $( 'form[id^="fr-arquivos"]' ).length;
var count = 0;
  for (i=0; i<qdeForms; i++) {
    if( $('form[id=fr-arquivos'+ i +'] .progress-meter-text').text() == '100%' ) {
      count++;
    }
  }
if (qdeForms == count) {alert('Todos updates foram Completos...');}
</script>

 

Editado por Maujor
Retirado o array
  • +1 2

Compartilhar este post


Link para o post
Compartilhar em outros sites

Acabei de testar, porem o FOR não funcionou e não entendi porque. Entretanto com a sua resposta consegui elaborar outra forma que chegou ao mesmo resultado colocando uma classe em cada div em que o update foi concluído e depois verificando se o numero de classes concluídas era igual ao numero de forms. Agradeço muito sua ajuda Sr. Maujor. 

Compartilhar este post


Link para o post
Compartilhar em outros sites

Eu verifiquei o código, e a sintaxe esta exatamente como você acabou de citar. O problema é que se eu colocava o código solto ele não funcionava, então coloquei em uma função que era disparada ao clicar no botão <a>('Inserir Updates'), porem ele só funcionava a parte do código que fazia a contagem dos forms,  eu coloquei um alert dentro do for e não disparava. Ele só disparava o alert quando eu clicava no botão de 'Inserir Updates' após selecionar um arquivo e ter completado o update, então eu selecionava outro arquivo(sem atualizar a pagina) e clicava novamente no botão 'Inserir Updates'. Sinceramente eu também não entendi o porque de não funcionar, mas se possível, poderia me passar o seu código de teste completo para que eu possa ver se entendo porque no meu script não funciona?

Compartilhar este post


Link para o post
Compartilhar em outros sites

Crie uma conta ou entre para comentar

Você precisar ser um membro para fazer um comentário

Criar uma conta

Crie uma nova conta em nossa comunidade. É fácil!

Crie uma nova conta

Entrar

Já tem uma conta? Faça o login.

Entrar Agora

  • Conteúdo Similar

    • Por _badi_
      Preciso de ajuda! Pode parecer uma dúvida besta, mas sou nova nessa área e não estou conseguindo resolver essa questão da facul!
      A questão é:
      1)      Faça o fluxograma e depois faça o código em Javascript de um programa  que lê  3 notas obtidas por um aluno e depois calcule  e imprima a média dos para avaliação, usando  a fórmula abaixo. Imprimir depois o conceito, conforme a tabela abaixo. Use o prompt no javascript e um botão que mostre a média e o conceito depois que do clique no mesmo.
      MA = (Nota1 + Nota2 x 2 + Nota3 x 3 + ME )/7
      Média de Aproveitamento
      Conceito
      10
      A
      7,5 e < 10
      B
      4,0 e < 7,5
      C
      < 4,0
      D
       
      Meu código ficou assim:
      <!DOCTYPE html> <html> <head>      </head> <body> Para calcular sua media e saber seu conceito, clique no botao abaixo: <br> <br> <button onclick='mostra()'>Try it</button> <p id="resp"></p> <br> <br> <script>     function mostra(){         var nota1 = prompt ("Digite a nota 1");         var resp1 = parseInt (nota1);         var nota2 = prompt ("Digite a nota 2");         var resp2 = parseInt (nota2);         var nota3 = prompt ("Digite a nota 3");         var resp3 = parseInt (nota3);         var ME = (resp1 + resp2 + resp3)/3;         var MA = resp1 + (resp2 * 2) + (resp3 * 3) + ME/7;         if (MA=10) {             document.getElementById("resp").innerHTML=("Sua media foi " + ME + " e seu conceito foi A!");         } else if (MA=7.5&&MA<10){             document.getElementById("resp").innerHTML=("Sua media foi " + ME + " e seu conceito foi B!");         } else if (MA=4&&MA<7.5){             document.getElementById("resp").innerHTML=("Sua media foi " + ME + " e seu conceito foi C!");         } else if (MA<4){             document.getElementById("resp").innerHTML=("Sua media foi " + ME + " e seu conceito foi D!");         }         }          </script> </body> </html>  
      Mas sempre volta como conceito A, não importa os valores que coloco :(
      Obrigado!
       
    • Por Eduardo S. B. de Oliveira
      Senhores, preciso de uma ajuda, estou criando um formulário onde o checkbox fique "checked" quando clicar em cima, mas o detalhe e que quando atualizar a pagina o checkbox permaneça marcado. É possível? 
    • Por alh
      Estou seguindo as especificações corretamente do git. https://github.com/opencartbrasil/opencart-rest-api/blob/master/README.md
      Estou tendo o erro ao acessar minha página de integração:
      ERRO: Not found (entity)
      Ao acessar minha página que contém o seguinte código: categorias.php
       
      No arquivo abaixo estou colocando a minha KEY e domínio correto.
      <?php $headers = array(); $headers[] = 'Content-Type: application/json'; $headers[] = 'key: MINHAKEY'; // // Replace key value for API key OpenCart (Only numbers and letters) $ch = curl_init(); curl_setopt_array($ch, [ CURLOPT_URL => 'http://www.NOMEDOMEUDOMINIO.com.br/api.php/categories', // Replace domain and table name CURLOPT_HTTPHEADER => $headers, CURLOPT_CUSTOMREQUEST => 'GET', CURLOPT_RETURNTRANSFER => true, CURLOPT_SSL_VERIFYHOST => false, CURLOPT_SSL_VERIFYPEER => false ]); $out = curl_exec($ch); curl_close($ch); print_r( $out ); // Result json ?>
    • Por gfontan1910
      Olá boa tarde. Preciso de uma ajuda na criação de um mapa do Brasil de forma dinâmica de modo que seja possível clicar nos estados. Assim que selecionado um estado, preciso exibir algumas informações deste determinado estado. O mapa seria algo parecido com esse da home do Olx (https://olx.com.br).
       
      Alguém pode ajudar com algum material voltado para este tipo de desenvolvimento?
       
       
      Obs: tem um tópico sobre isso no fórum, porém de 2015 e muitos links que foram recomendados estão off atualmente
    • Por jaquelss
      Estava fazendo download de coisas que uso no trabalho, mas parece que esqueci de algo. Sempre dá esse erro, mas tecnicamente parece que tá tudo ok?
      Eu esqueci algum programa ou algo do código em si?
      Agradeço desde já.
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.