Jump to content
Gonçalo Costa

Enviar dados local storage para uma div

Recommended Posts

Gonçalo Costa

Boa tarde,

Sou iniciante em javascript, e estava a fazer um site em que pretendia colocar um carrinho de compras. Não posso usar Jquery.

O que fiz foi primeiramente colocar os dados em local storage, e quando se clicar no carrinho de compras, mostrar uma div com os dados que foram guardados em local storage.

A minha dificuldade é passar os dados de local storage para o programa, e apresentá los numa div. 

segue parte do código que fiz. 

<div class="carrinho_de_compras_total">
<button onclick="mostrar()">carrinho_de_compras</button>
        <div class="mostrar_carrinho_de_compras" style="height: 200px; width: 100%;">
            <div class="itens"></div>
            <div class="total_dinheiro"></div>
        </div>
    
</div>
function compra_bilhete(n)
{
if(n==1)
{
    var tipo_bilhete= "espetáculo";
    ndias=1;
    var nome=document.getElementById('tipo_b1').innerHTML;
    var nadultos=document.getElementById('a_b1').value;
    var ncriancas=document.getElementById('c_b1').value;
    if(nadultos==0 & ncriancas==0)
    {
        alert("numero de pessoas inválido");
        return
    }
    preco_dia= 50*nadultos + 30*ncriancas;
    precoTotal=preco_dia *ndias;
    
}  else  if(n==2)
{
    var tipo_bilhete= "espetáculo";
    ndias=1;
    var nome=document.getElementById('tipo_b2').innerHTML;
    var nadultos=document.getElementById('a_b2').value;
    var ncriancas=document.getElementById('c_b2').value;
    if(nadultos==0 & ncriancas==0)
    {
        alert("numero de pessoas inválido");
        return
    }
    preco_dia= 50*nadultos + 30*ncriancas;
    precoTotal=preco_dia *ndias;
}
else  if(n==3)
{
    var tipo_bilhete= "espetáculo";
    ndias=1;
    var nome=document.getElementById('tipo_b3').innerHTML;
    var nadultos=document.getElementById('a_b3').value;
    var ncriancas=document.getElementById('c_b3').value;
    if(nadultos==0 & ncriancas==0)
    {
        alert("numero de pessoas inválido");
        return
    }
    preco_dia= 50*nadultos + 30*ncriancas;
    precoTotal=preco_dia *ndias;
}
// else  if(n==4)
// {
//     var tipo_bilhete= "espetáculo";
//     // var ndias=document.getElementById('dias_b2').innerHTML;
//     var tipo_espetaculo=document.getElementById('tipo_b3').innerHTML;
//     var nadultos=document.getElementById('a_b4').value;
//     var ncriancas=document.getElementById('c_b4').value;
//     var preco;
//     preco= 50*nadultos + 30*ncriancas;
// }
else  if(n==5)
{
    var tipo_bilhete= "Parque";
    var ndias=document.getElementById('dias_p1').value;
    var nome=document.getElementById('tipo_p1').innerHTML;
    var nadultos=document.getElementById('a_p1').value;
    var ncriancas=document.getElementById('c_p1').value;
    if(nadultos==0 & ncriancas==0)
    {
        alert("numero de pessoas inválido");
        return
    }
    preco_dia= 50*nadultos + 30*ncriancas;
    precoTotal=preco_dia *ndias;
}
else  if(n==6)
{
    var tipo_bilhete= "Parque";
    var ndias=document.getElementById('dias_p2').value;
    var nome=document.getElementById('tipo_p2').innerHTML;
    var nadultos=document.getElementById('a_p2').value;
    var ncriancas=document.getElementById('c_p2').value;
    if(nadultos==0 & ncriancas==0)
    {
        alert("numero de pessoas inválido");
        return
    }
    preco_dia= 50*nadultos + 30*ncriancas;
    precoTotal=preco_dia *ndias;
}
else  if(n==7)
{
    var tipo_bilhete= "Parque";
    var ndias=document.getElementById('dias_p3').value;
    var nome=document.getElementById('tipo_p3').innerHTML;
    var nadultos=document.getElementById('a_p3').value;
    var ncriancas=document.getElementById('c_p3').value;
    if(nadultos==0 & ncriancas==0)
    {
        alert("numero de pessoas inválido");
        return
    }
    preco_dia= 50*nadultos + 30*ncriancas;
    precoTotal=preco_dia *ndias;
}


    // Pega a lista já cadastrada, se não houver vira um array vazio
    var carrinho_de_compras = JSON.parse(localStorage.getItem('carrinho-compras') || '[]');
    // Adiciona reserva
    carrinho_de_compras.push({
     tipo_de_bilhete: tipo_bilhete,
     dias: ndias,
     nome:nome,
     numero_adultos: nadultos,
     numero_criancas: ncriancas,
     preco_total: precoTotal
    });
    // Salva a lista alterada
    localStorage.setItem("carrinho-compras", JSON.stringify(carrinho_de_compras));
    alert("Bilhete adicionado ao carrino de compras");

}


function mostrar(){


    for (i=0;i<99;i++)
    {
        var x=JSON.parse(localStorage.getItem('carrinho-compras'));
        if(x==null) return; // quando não houver mais dados no local storage, sai do ciclo for        

    }
    
}

Se alguém me pudesse ajudar agradecia imenso.

Cumprimentos

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

×
×
  • Create New...

Important Information

By using this site you accept our Terms of Use and Privacy Policy. We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.