Ir para conteúdo

POWERED BY:

Arquivado

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

Alfredao

[Resolvido] Atualizar campos em função do DropDown Value

Por , em Javascript

Recommended Posts

Alfredao    0

Alfredao
Postado

Olá, estou desenvolvendo um novo site para meu servidor de um jogo, neste jogo tem uma loja virtual para poderem comprar Itens para o jogo.

 

Estarei disponibilizando a compra de Itens com uma duração determinada de 30 dias, 15 dias e ilimitado.

 

O Código PHP está funcionando perfeitamente, mas eu não sei nada de Javascript.

 

Então eu gostaria de ajuda pra fazer algo parecido com isso.

 

Duração: 

<select size="1" name="duracao">
<option value="15">15</option>
<option value="30">30</option>
<option value="0" selected="selected">Ilimitado</option>                                                       
</select>

Duração: Ilimitado

Valor do Item: 5,000

Total de Moedas disponíveis: 10,000

Moedas restantes: 5,000

O código javascript faria o seguinte. Se a duração for 30 dias, o preço será dividido por 2.

 

Duração: 30 Dias

Valor do Item: 2,500

Total de Moedas disponíveis: 10,000

Moedas restantes: 7,500

Se a duração for 15 dias, o preço será dividido por 4.

 

Duração: 15 Dias

Valor do Item: 1,250

Total de Moedas disponíveis: 10,000

Moedas restantes: 8,500

E se a duração for ilimitada ficará

 

Duração: Ilimitado

Valor do Item: 5,000

Total de Moedas disponíveis: 10,000

Moedas restantes: 5,000

Então eu gostaria de ajuda pra criar una função pra atualizar os preços, quando eu selecionar no Drop Down.

 

Obrigado desde já, Alfredo

Compartilhar este post

Link para o post
Compartilhar em outros sites

Maujor    144

Maujor
Postado 

...
<body>
...
<table border="1" id="tabela">
<tr>
  <td>Duração:</td><td>Ilimitado</td>
</tr>
<tr>
  <td>Valor do Item:</td><td>5,000</td>
</tr>
<tr>
  <td>Total de Moedas disponíveis:</td><td>10,000</td>
</tr>
<tr>
  <td>Moedas restantes:</td><td>5,000</td>
</tr>
</table>
<select size="1" name="duracao" id="duracao">
<option value="15">15</option>
<option value="30">30</option>
<option value="0" selected="selected">Ilimitado</option>
</select>
...


...
<script type="text/javascript"> 
function calcula() {
var linha = document.getElementById("tabela").rows; 
	if(this.value == 15) {
	linha[0].cells[1].innerHTML = "15 dias";
	linha[1].cells[1].innerHTML = "1,250";
	linha[3].cells[1].innerHTML = "8,500";
	};
	if(this.value == 30) {
	linha[0].cells[1].innerHTML = "30 dias";
	linha[1].cells[1].innerHTML = "2,500";
	linha[3].cells[1].innerHTML = "7,500";
	};
	if(this.value == 0) {
	linha[0].cells[1].innerHTML = "ilimitado";
	linha[1].cells[1].innerHTML = "5,000";
	linha[3].cells[1].innerHTML = "5,000";
	};
}
var duracao = document.getElementById("duracao");
duracao.onchange = calcula;
</script>
</body>

Compartilhar este post

Link para o post
Compartilhar em outros sites

Alfredao    0

Alfredao
Postado

Olá, muito obrigado pelo código, ele funcionou ok.

 

Mas não estou conseguindo fazê-lo funcionar em meu site. Segue-se o Link do mesmo.

 

http://www.gunzbrasil.com/projeto/index.php?do=shop⊂=comprar&id=1

 

Usuário: Alfredao

Senha: alfredao

 

Eu gostaria que mudasse de valor Preço do Item, Moedas Atual e Moedas Restantes ao selecionar a duração.

 

Aqui está meu código, http://www.gunzbrasil.com/projeto/shop.txt

 

Obrigado mais uma vez, Alfredo.

Compartilhar este post

Link para o post
Compartilhar em outros sites

Maujor    144

Maujor
Postado

Seu código está assim:

<div align="center">
Duração:
<select size="1" name="duracao" onchange="UpdatePrice()" />
<option value="15">15</option>
<option value="30">30</option>
<option value="0" selected="selected">Ilimitado</option>
</select> 
(1200 Moedas)
</div>

Parece que você esta completamente perdido!

Onde está a função UpdatePrice()?

Compartilhar este post

Link para o post
Compartilhar em outros sites

Maujor    144

Maujor
Postado

Faça o seguinte:

No código HTML da página.

1-)acrescente id="duracao" no select: 

<select size="1" name="duracao" id="duracao" onchange="UpdatePrice()">

2-)acrescente id="tabela" na tabela: 

<table border="0" id="tabela" style="border-collapse: collapse" width="419" height="100%">

3-)acrescente o script antes de fechar BODY 

<script type="text/javascript"> 
function UpdatePrice() {	
var duracao = document.getElementById("duracao");
var linha = document.getElementById("tabela").rows; 

	if(duracao.value == 15) {
	linha[0].cells[2].innerHTML = "15 dias";
	linha[1].cells[2].innerHTML = "1,250";
	linha[2].cells[2].innerHTML = "8,500";
	};
	if(duracao.value == 30) {
	linha[0].cells[2].innerHTML = "30 dias";
	linha[1].cells[2].innerHTML = "2,500";
	linha[2].cells[2].innerHTML = "7,500";
	};
	if(duracao.value == 0) {
	linha[0].cells[2].innerHTML = "ilimitado";
	linha[1].cells[2].innerHTML = "5,000";
	linha[2].cells[2].innerHTML = "5,000";
	};
}
</script>

</body>
</html>

Veja a página funcionando em: http://jsbin.com/ifiro/2

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