Jump to content

nosredna

Members
  • Content count

    34
  • Joined

  • Last visited

Community Reputation

1 Comum

About nosredna

Recent Profile Visitors

The recent visitors block is disabled and is not being shown to other users.

  1. nosredna

    Múltiplos cálculos com JavaScript

    Bom... Segue o jeito que ficou depois de pronto: <!doctype html> <html lang="pt-br"> <head> <script src="https://code.jquery.com/jquery-3.3.1.js" ></script> <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css" integrity="sha384-HSMxcRTRxnN+Bdg0JdbxYKrThecOKuH5zCYotlSAcp1+c8xmyTe9GYg1l9a69psu" crossorigin="anonymous"> <style> .bd-placeholder-img { font-size: 1.125rem; text-anchor: middle; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } @media (min-width: 768px) { .bd-placeholder-img-lg { font-size: 3.5rem; } } </style> </head> <body> <div class="row"> <div class="col-sm-9"> <h1 align="center">Cálculo de Preços de Produtos</h1> </div> <div class="col-sm-3"> <br> <input type="button" class="btn btn-success btn-sm" value="Adicionar campos" onclick="AddCampos()"> </div> </div> <script type="text/javascript"> //Calculadora de Subtotal function calcula(){ var total = 0; $("div[id^=linha]:visible").each(function(){ var val_unit = parseFloat($(".class_unit input", this).val().replace(",", ".")); var qnt = $(".class_quant input", this).val(); var sub_total = val_unit * qnt; if(!isNaN(sub_total)) $(".class_total input", this).val(sub_total.toFixed(2).replace(".", ",")); total += parseFloat($("input[id^=total]", this).val().replace(",", ".")); }); if(!isNaN(total)) $("#total input.value_total").val(total.toFixed(2).replace(".", ",")); } //Total máximo de campos que você permitirá criar em seu site: var totalCampos = 10; //Não altere os valores abaixo, pois são variáveis controle; var iLoop = 1; var iCount = 0; var linhaAtual; function AddCampos() { var hidden1 = document.getElementById("hidden1"); var hidden2 = document.getElementById("hidden2"); //Executar apenas se houver possibilidade de inserção de novos campos: if (iCount < totalCampos) { //Limpar hidden1, para atualizar a lista dos campos que ainda estão vazios: hidden2.value = ""; //Atualizando a lista dos campos que estão ocultos. //Essa lista ficará armazenada temporiariamente em hidden2; for (iLoop = 1; iLoop <= totalCampos; iLoop++) { if (document.getElementById("linha"+iLoop).style.display == "none") { if (hidden2.value == "") { hidden2.value = "linha"+iLoop; }else{ hidden2.value += ",linha"+iLoop; } } } //Quebrando a lista que foi armazenada em hidden2 em array: linhasOcultas = hidden2.value.split(","); if (linhasOcultas.length > 0) { //Tornar visível o primeiro elemento de linhasOcultas: document.getElementById(linhasOcultas[0]).style.display = "block"; iCount++; //Acrescentando o índice zero a hidden1: if (hidden1.value == "") { hidden1.value = linhasOcultas[0]; }else{ hidden1.value += ","+linhasOcultas[0]; } /*Retirar a opção acima da lista de itens ocultos: <-------- OPCIONAL!!! if (hidden2.value.indexOf(","+linhasOcultas[0]) != -1) { hidden2.value = hidden2.value.replace(linhasOcultas[0]+",",""); }else if (hidden2.indexOf(linhasOcultas[0]+",") == 0) { hidden2.value = hidden2.value.replace(linhasOcultas[0]+",",""); }else{ hidden2.value = ""; } */ calcula(); } } } function RemoverCampos(id) { //Criando ponteiro para hidden1: var hidden1 = document.getElementById("hidden1"); //Pegar o valor do campo que será excluído: var campoValor = document.getElementById("valor_unitario"+id).value; //Se o campo não tiver nenhum valor, atribuir a string: vazio: if (campoValor == "") { campoValor = "vazio"; } if(confirm("O campo que contém o valor:\n» "+campoValor+"\nserá excluído!\n\nDeseja prosseguir?")){ document.getElementById("valor_unitario"+id).value="0"; document.getElementById("qnt"+id).value="0"; document.getElementById("linha"+id).style.display = "none"; iCount--; //Removendo o valor de hidden1: if (hidden1.value.indexOf(",linha"+id) != -1) { hidden1.value = hidden1.value.replace(",linha"+id,""); }else if (hidden1.value.indexOf("linha"+id+",") == 0) { hidden1.value = hidden1.value.replace("linha"+id+",",""); }else{ hidden1.value = ""; } calcula(); } } $(document).ready(function(){ $('div[id^=linha] input').on("input", calcula); }); //Escrevendo o código-fonte HTML e ocultando os campos criados: for (iLoop = 1; iLoop <= totalCampos; iLoop++) { document.write("<div id='linha"+iLoop+"' style='display:none'><table><td class='class_unit'>Valor Unitário "+iLoop+": R$ <input type='text' class='selectall' name='valor_unitario"+iLoop+"' id='valor_unitario"+iLoop+"' value='0,00' onkeyup='k(this);'/></td><td class='class_quant'>Quantidade "+iLoop+": <input type='text' class='selectall' name='qnt"+iLoop+"' id='qnt"+iLoop+"' value='0'/></td><td class='class_total'>SubTotal "+iLoop+": R$ <input type='text' name='total"+iLoop+"' id='total"+iLoop+"' readonly='readonly'/></td> <td><input class='btn btn-danger btn-sm' type='button' value='Remover' onclick='RemoverCampos(\""+iLoop+"\")'></td></table></div>"); } $(function() { $(document).on('click', '.selectall', function() { this.select(); }); }); //Máscara de casas decimais function k(i) { var v = i.value.replace(/\D/g,''); v = (v/100).toFixed(2) + ''; v = v.replace(".", ","); v = v.replace(/(\d)(\d{3})(\d{3}),/g, "$1.$2.$3,"); v = v.replace(/(\d)(\d{3}),/g, "$1.$2,"); i.value = v; } </script> <form name="form1" action="" method="post"> <hr> <div class="row"> <div class="col-sm-6"> <br><br> <input type="text" name="hidden1" id="hidden1" hidden> <input type="hidden" name="hidden2" id="hidden2"> </div> <div class="col-sm-3" id="total" align="right">Total: R$ <input class="value_total" readonly value='0,00'></input> </div> </div> <div class="col-sm-2"></div> </div> </form> </body> </html> Foi meio que um monstro de Frankenstein, vários códigos juntados... Espero que ajude quem também tem dúvidas. Fontes: https://forum.imasters.com.br/topic/581641-múltiplos-cálculos-com-javascript/ https://forum.imasters.com.br/topic/519699-multiplicar-quantidade-por-preço-e-exibir-no-total/ https://pt.stackoverflow.com/questions/363448/problema-de-compatibilidade-do-jquery1-7-2-para-o-jquery-3-3-1 https://pt.stackoverflow.com/questions/364034/selecionar-texto-do-textarea-com-variáveis-ao-clicar https://pt.stackoverflow.com/questions/363811/adicionar-ou-remover-inputs-com-js/363855?noredirect=1#comment726430_363855 https://forum.imasters.com.br/topic/325267-resolvido-adicionar-remover-campos-dinamicamente/
  2. Bom, consegui... a solução, para quem se interessar, seria substituir: function getElementParent(event){ return event.srcElement.parentNode.parentNode.getAttribute('id'); } por: function getElementParent(event){ return event.target.parentNode.parentNode.getAttribute('id'); } Solucionado!
  3. Bom... descobri que funciona com o jQuery 1.7.2, mas não como jQuery 3.3.1! Alguém sabe alguma solução para corrigir isso? Vlw
  4. Olá, no link: http://jsfiddle.net/QBTN6/2/ funcionou bonitinho, mas quando eu joguei em um editor de texto no meu pc dá o seguinte erro: Uncaught TypeError: Cannot read property 'parentNode' of undefined at getElementParent (final.html:21) at HTMLTableCellElement.<anonymous> (final.html:48) at HTMLTableCellElement.dispatch (jquery.js:4409) at HTMLTableCellElement.elemData.handle (jquery.js:4095) o que seria?
  5. Olá amigos, tenho o seguinte código: <html> <script type="text/javascript"> function Soma(){ var soma = 0; var ipts = document.querySelectorAll('input[oninput="Soma()"]'); for(var x=0; x<ipts.length; x++){ var valorItem = parseFloat(ipts[x].value); !isNaN(valorItem) ? soma += parseFloat(valorItem) : null; } document.querySelector('#final').value = soma.toFixed(2); } </script> <form action=""> Total produto1: <input type="text" oninput="Soma()" value="0"><br> Total produto2: <input type="text" oninput="Soma()" value="0"><br> <br> Total todos os produtos12: <input type="text" id="final"> </form> </html> Bom...para essas duas inputs funciona corretamente. Porém, se eu quiser colocar mais inputs como: Total produto3 + Total produto4 = Total todos os produtos34, Total produtoX + Total produtoY = Total todos os produtosXY, ... e usar o mesmo código JS, é possível? alguém poderia me dar uma dica de como eu faço para fazer isso? já tentei de várias maneiras, mas não estou tendo sucesso... Fico agradecido.
  6. nosredna

    [Resolvido] Manter Input Selecionado

    Vlw, ajudou mt! ;)
  7. Olá amigos, vocês poderiam me ajudar? Eu tenho a input abaixo em PHP, quando eu acabar de digitar algo eu desejo que ela selecione o texto digitado automaticamente. É possível? Como eu faria? Exemplo abaixo: Agradeço a ajuda. Valeuuuu.
  8. nosredna

    Erro de Depreciação no AJAX

    Pois é... Na verdade só descobri o problema quando adicionei a seguinte linha no JS: 'console.log(res);'. Ai descobri um 404 e passei uma geral para ver onde era o equivoco. Bom, em todo caso, mais um aprendizado. E fico agradecido, de coração, pela ajuda recebida dos amigos... Até a próxima dúvida...
  9. nosredna

    Erro de Depreciação no AJAX

    Olá senhores, Agradeço a ajuda, como eu disse eu não sou programador, mas tenho aprendido muito aqui no fórum. Acabei passando um pente fino em tudo e consegui resolver. O código JS estava assim: ---------------------------------------------------------------------------------------------------------------------------------------------------------------------- $(document).on('click', '.user-chat', function(event){ event.preventDefault(); var user_id = $(this).attr('user-id'); if($('.chat-user-'+user_id).length < 1){ var count_chat_box = $('.chat-box').length; if(count_chat_box < 3){ $.get('js/ChatBox.php', {id:user_id}, function(res){ <-- observe o 'C' maiúsculo aqui $('.chat-container').append(res); }); } } }); ---------------------------------------------------------------------------------------------------------------------------------------------------------------------- Só que o arquivo em PHP estava nomeado assim: chatBox.php <-- observe o 'C' minúsculo aqui Isso mesmo...mudei de minúsculo para maiúsculo e funcionou. Pode isso? Valeu galera, pode fechar o tópico, por favor.
  10. nosredna

    Erro de Depreciação no AJAX

    Subi sim, porém o acesso está restrito. Prefere que eu tire a restrição ou cole o código aqui? Valeu.
  11. nosredna

    Erro de Depreciação no AJAX

    Obrigado pela recomendação de leitura, realmente entendi alguns conceitos. Mas, de toda forma não consegui achar o erro no meu script, visto que como disse anteriormente, roda no local mas não no servidor... Perdoem-me pela falta de conhecimento, mas estou me esforçando para aprender. De toda forma agradeço muito.
  12. nosredna

    Erro de Depreciação no AJAX

    Então assim não funciona, pq o ChatBox é uma chamada interna, ele não altera a URL. Por exemplo, sabe quando você clica em algum contato do Facebook e abre a janela do chat sem vínculos com a URL? Funciona exatamente igual. Então se eu chamar: www.site.com.br/js/ChatBox.php?id=12 dá página não encontrada... Eu não estou entendendo o porque de funcionar no local e quando upado no servidor acontece o erro. Eu fiz um teste de apagar a função dentro do script JS, já que eu tinha algumas funções no msm arquivo, só para saber onde estava o erro e quando clico obviamente não aparece a janela do chat, mas também não apresenta o warning. P.S.: A janela do chat que eu digo é da mesma forma que a do Facebook. Para entender melhor e ilustrar considere minha página semelhante ao Face, com a janela de chat igual, a barra lateral de contatos e etc. Valeu.
  13. nosredna

    Erro de Depreciação no AJAX

    Vamos lá: No PHP o link para chamar a função é: <a class="nav-link user-chat" href="javascript:;" user-id="11" data-toggle="tooltip" data-placement="left" title="Usuário 11"> Que chama a função JS: $(document).on('click', '.user-chat', function(event){ event.preventDefault(); var user_id = $(this).attr('user-id'); if($('.chat-user-'+user_id).length < 1){ var count_chat_box = $('.chat-box').length; if(count_chat_box < 3){ $.get('js/ChatBox.php', {id:user_id}, function(res){ $('.chat-container').append(res); }); } } }); A função JS abre um arquivo PHP chamado ChatBox, que seria a janela do chat. No 'localhost' está exatamente assim e eu fiz o upload do mesmo jeito. Como eu não sou da área de programação e estou tentando ser autodidata, a minha aplicação foi baseada na playlist:
  14. nosredna

    Erro de Depreciação no AJAX

    Obrigado quanto ao esclarecimento do SO. Então eu não estou com o código aqui, mais tarde eu colo ele aqui para ilustrar. Porém, no meu 'localhost' roda certinho, quando eu clico no link abre a janela do chat e tudo mais; mas quando eu faço o upload do arquivo no servidor exatamente do mesmo jeito e quando eu clico no link da aplicação nada acontece (não abre a janela do chat) e esse aviso aparece no console do navegador (todos os navegadores). Esse aviso de boas praticas não deveria rodar a aplicação normalmente e só aparecer o "erro" no console? Obrigado por enquanto.
  15. nosredna

    Erro de Depreciação no AJAX

    Fala galera, criei um site em PHP e fiz uma aplicação de chat em tempo real utilizando o PHP + Ajax + Pusher. A aplicação funcionou redondinha no local. Porém, quando eu subi o site no servidor (que por sinal usa o Linux como SO), a aplicação dá o seguinte erro: [Deprecation] Synchronous XMLHttpRequest on the main thread is deprecated because of its detrimental effects to the end user's experience. Já tentei colocar o 'async:true' e nada... alguém sabe me informar se o fato do servidor usar o Linux tem alguma coisa a ver com o erro? alguém tem alguma ideia do que eu poderia fazer pra resolver? Valeu...
×

Important Information

Ao usar o fórum, você concorda com nossos Terms of Use.