Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Alguém me explica por favor, sou Iniciante e estou 'tentando' desenvolver esse sistema... primeira vez que mecho com códigos, mechia só com wordpress... Tudo que consegui fazer até agora foi graças a esse forum, rs.. enfim. Acesse essa pagina para entender o que preciso: http://www.doguinhos.com/sistema/cadastro_pedido.php (login: admin | senha: admin) Quero saber como faço para duplicar essas colunas até umas 20 por exemplo, e depois como somar "QUANT." + "PREÇO UNIT." = "TOTAL " e por fim somar "TOTAL" + "TOTAL" = "TOTAL DE TUDO" rsrs pelos códigos aq já vão perceber que sou leigo no assunto, então quem puder me ajudar me explique bem detalhado para que eu possa aprender! codigo da página:
<?php include('login/trancar.php').?> <?php include('includes/topo.php'). include('includes/cabecalho.php'). require_once('includes/header.php').?>
<head> <script type="text/javascript" src="ajax/js/jquery.js"></script> <script type="text/javascript" src="ajax/js/simpleAutoComplete.js"></script> <link rel="stylesheet" type="text/css" href="ajax/css/simpleAutoComplete.css" /> <script type="text/javascript"> $(document).ready(function() { $('#estado_autocomplete').simpleAutoComplete('ajax/ajax_query.php',{ autoCompleteClassName: 'autocomplete', selectedClassName: 'sel', attrCallBack: 'rel', identifier: 'estado' },estadoCallback). $('#cidade_autocomplete').simpleAutoComplete('ajax/ajax_query.php',{ autoCompleteClassName: 'autocomplete', selectedClassName: 'sel', identifier: 'cidade', },cidadeCallback). }). function estadoCallback( par ) { $("#fone").val( par[0] ). $("#endereco").val( par[1] ). $("#cidade_autocomplete").removeAttr("disabled"). } function cidadeCallback( par ) { $("#cod").val( par[0] ). $("#preco").val( par[1] ). $("#cidade_autocomplete").removeAttr("disabled"). } </script> </head>
<form method="post" action="cadastrando.php"> <div class="headi"> <div class="texto" style="left:20px. top:10px. "><p>Cliente:</p> </div> <div class="texto" style="left:370px. top:10px. "><p>Endereco:</p> </div> <div class="texto" style="left:690px. top:10px. "><p>Fone:</p> </div> <input type="text" id="estado_autocomplete" name="estado" autocomplete="off" class="imagem" style="left:100px. top:10px. width:250px. height:25px. "> <input type="text" disabled id="endereco" name="endereco" class="imagem" style="left:470px. top:10px. width:200px. height:25px. "> <input type="text" disabled id="fone" name="fone" class="imagem" style="left:750px. top:10px. width:150px. height:25px. "> </div><div class="corpo"> <div class="texto" style="left: 20px. top: 4px. "><p>Quant.</p> </div> <div class="texto" style="left: 100px. top: 4px. "><p>Cod.</p> </div> <div class="texto" style="left: 170px. top: 4px. "><p>Descricao dos Produtos</p> </div> <div class="texto" style="left: 646px. top: 4px. "><p>Unitário R$</p> </div> <div class="texto" style="left: 780px. top: 4px. "><p>TOTAL R$</p> </div> <input type="text" id="quant" class="imagem" style="left: 20px. top: 30px. width: 60px. height: 25px. "name="quant" />
<input type="text" disabled id="cod" class="imagem" style="left: 100px. top: 30px. width: 40px. height: 25px. "name="cod" />
<input type="text" id="cidade_autocomplete" class="imagem" style="left: 170px. top: 30px. width: 430px. height: 25px. "name="produto" />
<input type="text" disabled id="preco" class="imagem" style="left: 646px. top: 30px. width: 110px. height: 25px. "name="preco">
<input type="text" disabled id="total" class="imagem" style="left: 779px. top: 30px. width: 117px. height: 25px. "name="total" /> <input type="text" id="quant" class="imagem" style="left: 20px. top: 60px. width: 60px. height: 25px. "name="quant" />
<input type="text" disabled id="cod" class="imagem" style="left: 100px. top: 60px. width: 40px. height: 25px. "name="cod" />
<input type="text" id="cidade_autocomplete" class="imagem" style="left: 170px. top: 60px. width: 430px. height: 25px. "name="produto" />
<input type="text" disabled id="preco" class="imagem" style="left: 646px. top: 60px. width: 110px. height: 25px. "name="preco">
<input type="text" disabled id="total" class="imagem" style="left: 779px. top: 60px. width: 117px. height: 25px. "name="total" />... <input type="submit" name="Submit" class="botao" style="top:650px. left:750px. width:150px. color:#ffffff" value="Cadastrar "> </div>
</body></html>tô até agora sem consiguir achar nada na net, e ninguém conseguiu me explicar :S
Você quer que ele some direto sozinho? Terá que fazer um onchange e mudar todo id ao criar mais uma input, como você está duplicando as inputs?
Vê se assim vai ajudar.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('.imagem').change(function(){
var idp = this.id;
var quant = this.value;
var res = idp.split("_");
var preco = $("#preco_"+res[1]).val();
var total = quant*preco;
$("#total_"+res[1]).val(total);
});
});
</script>
</head>
<body>
<input type="text" id="quant_1" class="imagem" style="left: 20px; top: 30px; width: 60px; height: 25px;"name="quant[]"/>
<input type="text" disabled id="cod" class="imagem" style="left: 100px; top: 30px; width: 40px; height: 25px;"name="cod[]" />
<input type="text" id="cidade_autocomplete" class="imagem" style="left: 170px; top: 30px; width: 430px; height: 25px;"name="produto[]" />
<input type="text" disabled id="preco_1" class="imagem" style="left: 646px; top: 30px; width: 110px; height: 25px;"name="preco[]" value="10.00">
<input type="text" disabled id="total_1" class="imagem" style="left: 779px; top: 30px; width: 117px; height: 25px;"name="total[]" />
Não é duplicando o tópico que você vai conseguir resolver o seu problema:
http://forum.imasters.com.br/topic/519036-ajuda-duplicar-input-e-somar-valores-r/
Além do que, isso dai é mais fácil de resolver com JS.