Ir para conteúdo

POWERED BY:

Arquivado

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

Marcix

Campo select ocultar ou mostrar div

Recommended Posts

Olá pessoal preciso de uma ajudinha.

O objetivo da função abaixo é

 

Se o valor da compra for MAIOR que 500 então mostra as div divNumParcVisa ou divNumParc.

Se o valor da compra for MENOR que 500 então mostra a div divNumParc03 e oculta as divs divNumParcVisa e divNumParc.

 

--

Problema

 

Há um campo select com 4 opções VISA, MASTECARD, DINERS, AMEX.

 

Se o valor da compra for MAIOR do que 500 e for selecionado VISA aparece a div divNumParcVis, porem se o usuário

mudar para MASTERCARD some todas as divs divNumParcVisa e divNumPar então o usuario teria que ficar atualizando a

página para aparecer as divs sempre que ele ficar mudando de opção no select.

 

--

 

O que preciso.

 

 

Preciso que o script entenda que se a compra for MAIOR do que 500 e for seleciondo VISA então ele vai mostrar somente a divNumParcVisa.

Preciso que o script entenda que se a compra for MAIOR do que 500 e for seleciondo MASTERCAR,DINERS,AMEX então ele vai mostrar somente a divNumParc.

 

Se o valor for MENOR do que 500 então ele mostra divNumParc03 para qualquer que seja a seleção.

 

Ou seja o usuário pode ficar mudando de opção no select que as div correspondentes a seleçao vão aparecer sem a necessidade de ficar atualizando

a página.

--

 

	function validaParcelas(valor_compra)

{

	var valor_compra;
	var objForm = document.getElementById('frmPedido');
	var objDivNumParcVisa = document.getElementById('divNumParcVisa');
	var objDivNumParc = document.getElementById('divNumParc');
	var objDivNumParc03 = document.getElementById('divNumParc03');

	if (valor_compra > 500.00)
	{
		onload

		objDivNumParcVisa.style.display = 'block';// ---------------------- [b] aparecer somente se o visa for selecionado [/b]
		objDivNumParc.style.display = 'block'; // ------------------------- [b]aparecer somente se as outras bandeiras forem selecionadas[/b]
		objDivNumParc03.style.display = 'none';
		
		return(true);
	}
	else
	{
		objDivNumParcVisa.style.display = 'none';
		objDivNumParc.style.display = 'none';
		objDivNumParc03.style.display = 'block';		
		return(true);
	}
}
--

 

CAMPO SELECT

	<select size="1" name="Bandeira" class="TextBoxCompras" onChange="VerificaFormaPagto();"  id=Bandeira>
								<option selected>Selecione...</option> 
								<option value="VISA">Cartão de Crédito Visa</option> 
								<option value="MASTERCARD">Cartão de Crédito Mastercard</option> 
								<option value="DINERS">Cartão de Crédito Diners</option> 
								<option value="AMEX">Cartão de Crédito Amex</option> 
							</select>

Compartilhar este post


Link para o post
Compartilhar em outros sites

Exemplo utilizando Jquery...

 

<script type="text/javascript">
function validaParcela(valor)
            {
                var select = $("#Bandeira").val();
                if (valor > 500){
                    if (select == "VISA"){
                        $("#formapag div").hide();
                        $("#objDivNumParcVisa").show()
                        .text("Você selecionou " + select);
                    } else if (select != "Selecione...") {
                        $("#formapag div").hide();
                        $("#objDivNumParc").show()
                        .text("Você selecionou " + select);
                    } else {
                        $("#formapag div").hide();
                    }
                } else if (valor < 500) {
                    $("#formapag div").hide();
                    $("#objDivNumParc03").show()
                    .text("Valor < 500.");
                }
            }
</script>

Compartilhar este post


Link para o post
Compartilhar em outros sites

Tá dificil.

O código ta ficando assim ele mostra a divNumParc03 mas não mostra as outras

acho que tá passando direto ao invés de parar.

 

function validaParcelas(valor_compra,bandiera)
{
	var valor_compra;
	var objForm = document.getElementById('frmPedido');
	var objDivNumParcVisa = document.getElementById('divNumParcVisa');
	var objDivNumParc = document.getElementById('divNumParc');
	var objDivNumParc03 = document.getElementById('divNumParc03');
	var select = document.getElementsByName('Bandeira');
  
    	if (valor_compra > 500.00 )
		if (select == "VISA")
	{
		onload
		objDivNumParcVisa.style.display = 'block';
		objDivNumParc03.style.display = 'none';
		
		return(true);
		
	}
		else if (select == "MASTERCARD")
	{
		onload
		objDivNumParc.style.display = 'block';
		objDivNumParc03.style.display = 'none';
		
		return(true);		
	}
	else if (select == "DINERS")
	{
		onload
		objDivNumParc.style.display = 'block';
		objDivNumParc03.style.display = 'none';
		
		return(true);
		
	}	
		else if (select == "AMEX")
	{
		onload
		objDivNumParc.style.display = 'block';
		objDivNumParc03.style.display = 'none';		
		return(true);		
	}
		
	else
	{
		objDivNumParcVisa.style.display = 'none';
		objDivNumParc.style.display = 'none';
		objDivNumParc03.style.display = 'block';		
		return(true);
	}
}


//-->

</script> 

 

Formulário

			<select size="1" name="Bandeira" class="TextBoxCompras" onChange="VerificaFormaPagto();"  id=Bandeira>
								<option selected>Selecione...</option> 
								<option value="VISA">Cartão de Crédito Visa</option> 
								<option value="MASTERCARD">Cartão de Crédito Mastercard</option> 
								<option value="DINERS">Cartão de Crédito Diners</option> 
								<option value="AMEX">Cartão de Crédito Amex</option> 
							</select>   

Compartilhar este post


Link para o post
Compartilhar em outros sites

troca:

var select = document.getElementsByName('Bandeira');
por:
var select_bandeira = document.getElementById('Bandeira').value;

ai você arruma nos IFs..

e tenta definir melhor a lógica do IF com o numero.. ali ele ficou meio perdido.. sem {} alguma..

 

e onde você chama validaParcelas() ?

Compartilhar este post


Link para o post
Compartilhar em outros sites

Acho que entendi porque não está dando certo.

 

onload é o valor da parcela e para a função funcionar o javascript deveria carregar esse

valor toda vez que a opção do select for alterada mas ele faz isso apenas se a página for

atualizada e apenas uma vez.

 

<body id="principal" onLoad="validaParcelas('501');">

 

Está acontecnendo assim da primeira vez que o código é executado ele

funciona normal se eu alterar a opção no selct ele não executa

novamente então não aparce div nenhuma para aparecer tenho

que dar F5.

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

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