Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Jonata Rodrigues

Inserir +1 opção na select

Por , em Javascript

Recommended Posts

Jonata Rodrigues    0

Jonata Rodrigues
Postado

Beleza galera.. Então eu não tenho conhecimento na área de de programação, mas andei pesquisando sobre e encontrei esses códigos que me serão úteis.. porem não consigo fazer uma edição pra ficar como desejo.. primeira bronca!

Existem 2 valores e quando Marca 1 é selecionado o value do input vai a 10 quando Marca 2 selecionado value vai para 15...
Eu só queria que existissem mais que 2 options.. tipo quero até 5 marcas de arroz! Alguém pode me dar uma luz!
Código é o seguinte:
   Arroz: <select name="option-arroz" id="sel-option-arroz">
  <option value=""></option>
  <option value="0">Marca 1</option>
  <option value="1">Marca 2</option>
  </select>

<input type="option-arroz" name="arroz" id="input-option-arroz" readonly value="0"  onBlur="decimal(this);Soma();"><br><br>
<script type="text/javascript">
var $select = document.getElementById('sel-option-arroz'),
    $input  = document.getElementById('input-option-arroz');

$select.addEventListener('change', function(){
  $input.value = this.value === '0' ? '10' : '15';
});
</script>

Segunda Bronca!

 

Seguindo esse modelo o input vai ter o valor do meu arroz, e vou ter vários outros itens, e no final um TOTAL.. que soma todos os outros itens... tá somando direitinho, porém só faz a soma se clicar no input com valor, eu quero que some os values ao clicar no option que está a opção da marca. conseguirão entender!
Exemplo de como está: fanro.hol.es/soma/

E o olha o código

<html>
<head>
<title>SOMA</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language="javascript">
function Soma(){
document.formulario.total.value = (parseFloat(document.formulario.arroz.value) + parseFloat(document.formulario.feijao.value)+ parseFloat(document.formulario.macarrao.value)) * 1.00;
decimal(document.forms[0].total);
}
function decimal(x)
{
	if(x.value.indexOf(",") == -1)
  x.value += ".00";
	else
  x.value += "0";
}
</script>
</head>
 <body bgcolor="#FFF" text="#000">
<form name="formulario" method="post" action="">

   Arroz: <select name="option-arroz" id="sel-option-arroz">
  <option value=""></option>
  <option value="0">Arroz Tio Jorge - R$10</option>
  <option value="1">Gold - R$12</option>
  </select>

<input type="option-arroz" name="arroz" id="input-option-arroz" readonly value="0"  onBlur="decimal(this);Soma();"><br>
<script type="text/javascript">
var $select = document.getElementById('sel-option-arroz'),
    $input  = document.getElementById('input-option-arroz');

$select.addEventListener('change', function(){
  $input.value = this.value === '0' ? '10' : '12';
});
</script>

   Feijão: <select name="op-feijao" id="sel-op-feijao">
  <option value=""></option>
  <option value="0">Feijão Tio Jorge - R$5</option>
  <option value="1">Gold - R$4</option>
  </select>

<input type="op-feijao" name="feijao" id="input-op-feijao" readonly value="0"  onBlur="decimal(this);Soma();"><br>
<script type="text/javascript">
var $select_fj = document.getElementById('sel-op-feijao'),
    $input_fj  = document.getElementById('input-op-feijao');

$select_fj.addEventListener('change', function(){
  $input_fj.value = this.value === '0' ? '5.0' : '4.0';
});
</script>

   Macarrão: <select name="op-macarrao" id="sel-op-macarrao">
  <option value=""></option>
  <option value="0">Nissin - R$3</option>
  <option value="1">Gold - R$4</option>
  </select>

<input type="op-macarrao" name="macarrao" id="input-op-macarrao" readonly value="0"  onBlur="decimal(this);Soma();"><br>
<script type="text/javascript">
var $select_mcr = document.getElementById('sel-op-macarrao'),
    $input_mcr  = document.getElementById('input-op-macarrao');

$select_mcr.addEventListener('change', function(){
  $input_mcr.value = this.value === '0' ? '3.0' : '4.0';
});
</script>
        Total: <input type="text" name="total" maxlength="255" size="50"><br>
</form>
</body>
</html>

Alguém poderia me dar uma força!?

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Javascript
×

Informação importante

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

  Aceito