Ir para conteúdo
jpivinhema

erro ao receber dados de localstorage

Recommended Posts

boa tarde galera...tenho uma pagina com um button que faço a gravação de dados em locastorage... onde em outra pagina quero o retorno dos dados gravados...os dados estao retornando com esse codigo.

 

esse script esta em outra pagina

 

 

<script>
for(i=1; i<=99; i++) // verifica até 99 dados registrados na localStorage
 {
     var prod = localStorage.getItem("pag" + i + ""); // verifica se há recheio nesta posição.
     if(prod != null)
     {    
         // exibe os dados da lista dentro da div itens...esse codigo esta retornando os valores em texto
         document.getElementById("itens").innerHTML += localStorage.getItem("pag" + i) + " x ";   //isso é um link ex: santos.html
         document.getElementById("itens").innerHTML += localStorage.getItem("titulo" + i) + " x ";  //isso é um titulo ex: santos
         document.getElementById("itens").innerHTML += localStorage.getItem("tag" + i) + "<hr>";  //isso é uma tag  ex: estado

 

// eu queria que o retorno fosse em forma de uma li como esta que esta a baixo

 

<li class="topcoat-list__item"><a href="santos.html">santos</a><br /><span style="font-size:11px;">estado</span></li>

 

 

// tentei fazer dessa forma que esta a baixo mas não esta retornando os dados do DB, o que pode estar errado??

// alguem pod me ajudar por favor
        

 

        document.getElementById("itens").innerHTML += "<li class='topcoat-list__item'>" + "<a href='localStorage.getItem('pag' + i)'>" + "localStorage.getItem('titulo' + i)" + "</a><br /><span style='font-size:11px;'>" + "localStorage.getItem('tag' + i)" + "</span></li>";


     }
 }

</script>

 

 

 

desde ja muito obrigado pela ajuda!!

cats2.jpg

Compartilhar este post


Link para o post
Compartilhar em outros sites

boa noite mano como voce ta salvando o storage

 

 
 var items= sessionStorage.getItem('Carinho');


   for (i = 0; i < items.length; i++){
 var produtoHtml = '<li class="topcoat-list__item"><a href="santos.html">santos</a><br /><span style="font-size:11px;">'+items.nome+'</span></li>';


}

 

Compartilhar este post


Link para o post
Compartilhar em outros sites
12 horas atrás, Marcos_imasters disse:

boa noite mano como voce ta salvando o storage

 



 

 var items= sessionStorage.getItem('Carinho');


   for (i = 0; i < items.length; i++){
 var produtoHtml = '<li class="topcoat-list__item"><a href="santos.html">santos</a><br /><span style="font-size:11px;">'+items.nome+'</span></li>';


}

 

Bom dia marcos...deixa eu me explicar melhor....na primeira pagina eu tenho mais de 1000 li como essa

 

<li class="topcoat-list__item"><a href="santos.html">santos</a><br /><span style="font-size:11px;">estado</span></li>

 

.q estou colocando manualnente uma por uma ...um form com um button e inputs com dados em hidem.( id...pag...titulo....tag......q no caso esse button faz a gravacao dos dados da li em localstorage...q no caso o button grava o id....o link do href...o texto q esta lincado no href e um texto q esta no span...( tag )..

 

Exemplo modelo da LI

 

<li class="topcoat-list__item"><a href="santos.html">santos</a><br /><span style="font-size:11px;">time</span></li>

 

obs: tenho mais de 1000 lis como esta em uma unica pagina...AI você DEVE PERGUNTAR PRA Q ISSO....IMAGINA..TEM MAIS DE 1000 LI Q ESTA LINCADA A UMA PAGINA PRA CADA LI...ENTAO PENSEI.. SE O USUARIO MARCAR SUAS LI FAVORITAS EX.. UMAS 100 OU 120...ENTAO EU CRIO UMA PAGINA Q RETORNARA ESSAS LI Q ELE ADICIONOU EM FAVORITAS...FACILITANDO SSEU ACESSO E LOCALIZACAO.

 

AI HE A ONDE ENTRA ESSA PAGINA HTML ONDE

NESSA PAGINA TENHO ESSE SCRIPT Q ME RETORNa os dados q esta gravado no localstorage

 

  

<script>
for(i=1; i<=99; i++) // verifica até 99 dados registrados na localStorage
 {
     var prod = localStorage.getItem("pag" + i + ""); // verifica se há recheio nesta posição.
     if(prod != null)
     {    
         // exibe os dados da lista dentro da div itens...esse codigo esta retornando os valores em forma de texto...mas queria q me retornasse na forma de li...como no meu modelo de li.
         document.getElementById("itens").innerHTML += localStorage.getItem("pag" + i) + " x ";   //isso é um link ex: santos.html
         document.getElementById("itens").innerHTML += localStorage.getItem("titulo" + i) + " x ";  //isso é um titulo ex: santos
         document.getElementById("itens").innerHTML += localStorage.getItem("tag" + i) + "<hr>";  //isso é uma tag  ex: tag

 

 

//TENTEI FAZER DESSA FORMA MAS NAO DEU CERTO

        document.getElementById("itens").innerHTML += "<li class='topcoat-list__item'>" + "<a href='localStorage.getItem('pag' + i)'>" + "localStorage.getItem('titulo' + i)" + "</a><br /><span style='font-size:11px;'>" + "localStorage.getItem('tag' + i)" + "</span></li>";


     }
 }

</script>

 

NA VERDADE TUDO ISSO HE UMA APLICACAO OFFLINE EM HTML...

 

OBRIGADO PELA AJUDA.

Compartilhar este post


Link para o post
Compartilhar em outros sites

você ta com dificuldade de gerar os elementos?

 

tenta assim qualquer coisa manda o array ai do strogade

  for(i=1; i<=99; i++) // verifica até 99 dados registrados na localStorage
 {
     var prod = localStorage.getItem("pag" + i + ""); // verifica se há recheio nesta posição.
     if(prod != null)     {    
     
        var html = "<li class='topcoat-list__item'><a href='localStorage.getItem('pag' "+ i+")'>" +localStorage.getItem('titulo' + i)+ "</a><br /><span style='font-size:11px;'>" +localStorage.getItem('tag' + i) + "</span></li>";
      
        document.querySelector('.resultado').insertBefore(html, document.querySelector('.resultado').childNodes[0])
     }
 }

 

Compartilhar este post


Link para o post
Compartilhar em outros sites
Em 30/06/2018 at 17:06, Marcos_imasters disse:

você ta com dificuldade de gerar os elementos?

 

tenta assim qualquer coisa manda o array ai do strogade


  for(i=1; i<=99; i++) // verifica até 99 dados registrados na localStorage
 {
     var prod = localStorage.getItem("pag" + i + ""); // verifica se há recheio nesta posição.
     if(prod != null)     {    
     
        var html = "<li class='topcoat-list__item'><a href='localStorage.getItem('pag' "+ i+")'>" +localStorage.getItem('titulo' + i)+ "</a><br /><span style='font-size:11px;'>" +localStorage.getItem('tag' + i) + "</span></li>";
      
        document.querySelector('.resultado').insertBefore(html, document.querySelector('.resultado').childNodes[0])
     }
 }

 

Ola marcos....consegui resolver esse problema...mas agora preciso colocar um button dentro de cada li com uma funcao de remover ela do localstorage

 

Seria algo assim??

 

document.getElementById("itens").innerHTML += "<li class='topcoat-list__item'>" + "<a href='" + localStorage.getItem('pag' + i) + "\'>" + localStorage.getItem('titulo' + i) + "</a><br /><span style='font-size:11px;'>" + localStorage.getItem('tag' + i) + "</span><div style='margin:-35px 0px 0px 0px;' align='right'><button type='button' onClick='localStorage.removeItem(como e que valores coloco aqui???); location.reload();'> Excluir </button></div></li>";

Compartilhar este post


Link para o post
Compartilhar em outros sites

sim usando onclick da certo sim.

 

exemplo 

onclick='remove_produto("+produto.i+")'




function remove_produto(id){
	
	
	var retrieveArray = JSON.parse(sessionStorage.getItem("Produtos"));
 if(retrieveArray == null) retrieveArray = [];
	
for (i=0; i<retrieveArray.length; i++){
    if (retrieveArray[i].id == id) {
		retrieveArray.splice(i,1)
       sessionStorage.setItem("Produtos", JSON.stringify(retrieveArray));
    }
}

 

Compartilhar este post


Link para o post
Compartilhar em outros sites

Crie uma conta ou entre para comentar

Você precisar ser um membro para fazer um comentário

Criar uma conta

Crie uma nova conta em nossa comunidade. É fácil!

Crie uma nova conta

Entrar

Já tem uma conta? Faça o login.

Entrar Agora

  • Conteúdo Similar

    • Por jlrs19833
      Bom dia, pessoal! Estou precisando de uma luz para saber como tratar determinado problema:
       
      Cenário: Ambiente em desenvolvimento de plataforma para gestão de uma empresa.
      Linguagem principal: PHP (framework CodeIgniter)
      Dificuldade: retornar dados de select dinâmico junto ao evento de post do formulário.
       
      Descrição: Conforme mencionado acima, estou desenvolvendo um pequeno sistema para uma empresa que conterá poucas telas, sou desenvolver entusiasta, então não tenho muito conhecimento e prática com este assunto. Em determinada tela, o cliente quer que haja um formulário de cadastro onde dentre os diversos campos deste form, haverá dois do tipo select, onde um é o select de cidade e o outro do tipo estado. O select de Estado é preenchido automaticamente quando do carregamento da view, através de uma chamada do controller/model junto ao BD e o select cidade é preenchido de maneira automática, com javascript, através de uma mesma consulta, passando o ID do campo estado. Minha dificuldade está quando faço o submit deste form, pois o campo value do option deste select (cidade) não é enviado junto, pois no código fonte ele não foi carregado. Como posso fazer para recuperar esse value e enviar junto com o evento de submit?
       
      Segue como meus arquivos estão sendo feitos. Como pode observar estou, tentando apenas printar os campos para que eu possa ter certeza que eles estão sendo carregados.
      https://gist.github.com/jlrs19833/808887a5221ff31ca6ea22bf0c8b85a5
       
      Peço desculpas se estou postando no local errado e que os moderadores me orientem neste caso.
       
      Desde já agradeço o auxílio de cada um.
    • Por 4ly
      Olá. Bom basicamente eu tenho um botão âncora que leva até a aba de sobre do meu site, só que ele não tem animação, ele simplesmente "teleporta" para essa aba do nada isso não é legal. 
      Gostaria de saber algum código de JavaScript ou CSS para solucionar isso 
      Esse é o código : 
       
      <button id="explorer"><a href="#about">Explorar</a></button>
    • Por leo_santo1
      Venho por meio desse post procurar ajuda com meu código!
      Estou fazendo um código usando `DataTable` , sou iniciante na programação, depois de umas pesquisas e até mesmo algumas dicas conseguir construir uma DataTable com banco de dados.
      Continuando minhas pesquisas para aprimorar mais ainda o código, percebi que a  `DataTable` possuir varias funções interessantes, umas delas em especifico chamou bastante minha atenção e até me ajudaria no código que no caso é o uso de Linhas filhas ocultas, que quando fazemos o click em cima de um botão aparece as informações extras da linha ( no caso os dados a mais do banco ) e ao apertar ela novamente ele oculta as informações.
      Gostaria de ajuda para criar essa função na minha Tabela, já realizei pesquisas no próprio site da  `DataTable` , aqui, porem não entendo bem o jeito que eles explicam.
      segue abaixo meu código da table e da  `DataTable` que conecta com o Banco.
       
      Tabela
      <table id="employee-grid" cellpadding="0" cellspacing="0" border="0" class="display" width="100%"> <thead> <tr> <th>Nome</th> <th>CPF</th> <th>Data de Nascimento</th> <th></th> <th>Ação</th> <th></th> </tr> </thead> <thead> <tr> <td><input type="text" data-column="0" class="search-input-text" style="width: 150px;"></td> <th><input type="text" data-column="1" class="search-input-text" style="width: 150px;"></td> <th><input type="text" id="data" data-column="2" class="search-input-text" style="width: 150px;"></th> <th></th> <td> </td> <td></td> </tr> </thead> </table> Script DataTable
      $(document).ready(function() { var dataTable = $('#employee-grid').DataTable( { "processing": true, "serverSide": true, "bJQueryUI": true, "oLanguage": { "sProcessing": "Processando...", "sLengthMenu": "Mostrar _MENU_ registros", "sZeroRecords": "Não foram encontrados resultados", "sInfo": "Mostrando de _START_ até _END_ de _TOTAL_ registros", "sInfoEmpty": "Mostrando de 0 até 0 de 0 registros", "sInfoFiltered": "", "sInfoPostFix": "", "sSearch": "Buscar:", "sUrl": "", "oPaginate": { "sFirst": "Primeiro", "sPrevious": "Anterior", "sNext": "Seguinte", "sLast": "Último" } }, "ajax":{ url :"../Tabelas/Tabela_consulta_cliente.php", // json datasource type: "post", // method , by default get error: function(){ // error handling $(".employee-grid-error").html(""); $("#employee-grid").append('<tbody class="employee-grid-error"><tr><th colspan="3">No data found in the server</th></tr></tbody>'); $("#employee-grid_processing").css("display","none"); } } } ); $("#employee-grid_filter").css("display","none"); // hiding global search box $('.search-input-text').on( 'keyup click', function () { // for text boxes var i =$(this).attr('data-column'); // getting column index var v =$(this).val(); // getting search input value dataTable.columns(i).search(v).draw(); } ); $('.search-input-select').on( 'change', function () { // for select box var i =$(this).attr('data-column'); var v =$(this).val(); dataTable.columns(i).search(v).draw(); } ); } ); Conexão DataTable com o Banco de dados
      <?php $servername = "localhost"; $username = "root"; $password = ""; $dbname = "loc_equipamentos"; $conn = mysqli_connect($servername, $username, $password, $dbname) or die("Connection failed: " . mysqli_connect_error()); $requestData= $_REQUEST; $columns = array( 0=>'nome_usuario', 1=> 'cpf_usuario', 2=> 'data_nascimento', 3=> 'id_usuario', 4=> 'id_usuario', 5=> 'id_usuario' ); $sql = "SELECT nome_usuario, cpf_usuario, data_nascimento, id_usuario "; $sql.=" FROM usuario"; $query=mysqli_query($conn, $sql) or die("employee-grid-data.php: get employees"); $totalData = mysqli_num_rows($query); $totalFiltered = $totalData; . $sql = "SELECT nome_usuario, cpf_usuario, data_nascimento, id_usuario "; $sql.=" FROM usuario WHERE tipo_perfil = 'CLIENTE' AND ativo_usuario = 'TRUE'"; if( !empty($requestData['columns'][0]['search']['value']) ){ $sql.=" AND nome_usuario LIKE '".$requestData['columns'][0]['search']['value']."%' "; } if( !empty($requestData['columns'][1]['search']['value']) ){ $sql.=" AND cpf_usuario LIKE '".$requestData['columns'][1]['search']['value']."%' "; } if( !empty($requestData['columns'][2]['search']['value']) ){ //age $sql.=" AND data_nascimento LIKE '".$requestData['columns'][2]['search']['value']."%' "; } $query=mysqli_query($conn, $sql) or die("employee-grid-data.php: get employees"); $totalFiltered = mysqli_num_rows($query); $sql.=" ORDER BY ". $columns[$requestData['order'][0]['column']]." ".$requestData['order'][0]['dir']." LIMIT ".$requestData['start']." ,".$requestData['length']." "; $query=mysqli_query($conn, $sql) or die("employee-grid-data.php: get employees"); $data = array(); while( $row=mysqli_fetch_array($query) ) { $nestedData=array(); $informacao ="<div class='botaodiv'> <a href = ?informacao=".$row['id_usuario']." >+ Informações</a> </div>"; $editar ="<div class='botaodiv'> <a href = ?editar=".$row['id_usuario']." >Editar</a> </div>"; $deletar ="<div class='botaodiv'> <a href = ../Eventos/evento.php?DesativaCadastro=".$row['id_usuario']." >Excluir</a> </div>"; $nestedData[] = $row["nome_usuario"]; $nestedData[] = $row["cpf_usuario"]; $nestedData[] = $row["data_nascimento"]; $nestedData[] = $informacao; $nestedData[] = $editar; $nestedData[] = $deletar; $data[] = $nestedData; } $json_data = array( "draw" => intval( $requestData['draw'] ), "recordsTotal" => intval( $totalData ), "recordsFiltered" => intval( $totalFiltered ), "data" => $data ); echo json_encode($json_data); ?> Fora o caso de criar Detalhes para Linhas, Caso alguém tenha alguma sugestão de como melhorar meu código ( por exemplo uma Conexão ao Banco mais simples, um Js melhor etc.. ) ou alguma critica para eu evoluir, irei agradecer bastante!  
    • Por anepri
      Preciso fazer uma página de consulta onde selecionando a cidade traga como resultado estabelecimentos comerciais daquela cidade. O exemplo do código que estou usando funciona perfeitamente com países, estados e cidade, mas na hora que faço a função "lojas", mesmo o código sendo idêntico não aparece o resultado. O que tem me deixado doida é que os primeiros select funcionam, mas o último "lojas" não funciona de jeito nenhum! Alguém pode olhar o código e me dizer onde estou pecando?
       
      $(function(){ // Pais function pais(){ $.ajax({ type: 'GET', url: 'funcoes.php', data: { acao: 'pais' }, dataType: 'json', success: function(data){ console.log(data); for(i = 0; i < data.qtd; i++){ $('select[name=pais]').append('<option value="'+data.id[i]+'">'+data.pais[i]+'</option>'); } } }); } pais(); function estado(pais){ $.ajax({ type: 'GET', url: 'funcoes.php', data: { acao: 'estado', id: pais }, dataType: 'json', beforeSend: function(){ $('select[name=estado]').html('<option>Carregando...</option>'); }, success: function(data){ $('select[name=estado]').html(''); $('select[name=estado]').append('<option>Selecione o estado</option>'); for(i = 0; i < data.qtd; i++){ $('select[name=estado]').append('<option value="'+data.id[i]+'">'+data.estado[i]+'</option>'); } } }); } // Cidade function cidade(estado){ $.ajax({ type: 'GET', url: 'funcoes.php', data: { acao: 'cidade', id: estado }, dataType: 'json', beforeSend: function(){ $('select[name=cidade]').html('<option>Carregando...</option>'); }, success: function(data){ $('select[name=cidade]').html(''); $('select[name=cidade]').append('<option>Selecione a cidade</option>'); for(i = 0; i < data.qtd; i++){ $('select[name=cidade]').append('<option value="'+data.id[i]+'">'+data.cidade[i]+'</option>'); } } }); } function contrubuinte(cidade){ $.ajax({ type: 'GET', url: 'funcoes.php', data: { acao: 'contrubuinte', id: cidade }, dataType: 'json', beforeSend: function(){ $('select[name=contrubuinte]').html('<option>Carregando...</option>'); }, success: function(data){ console.log(data); $('select[name=contrubuinte]').html(''); $('select[name=contrubuinte]').append('<option>Selecione a contrubuinte</option>'); for(i = 0; i < data.qtd; i++){ $('select[name=contrubuinte]').append('<option value="'+data.id[i]+'">'+data.contrubuinte[i]+'</option>'); } } }); } $('select[name=pais]').change(function(){ var id = $(this).val(); estado(id); }); $('select[name=estado]').change(function(){ var idEstado = $(this).val(); cidade(idEstado); }); $('select[name=cidade]').change(function(){ var id = $(this).val(); contrubuinte(id); }); }); <?php require("config.php"); $retorno = array(); if($_GET['acao'] == 'pais'){ $sql = $pdo->prepare("SELECT * FROM pais"); $sql->execute(); $n = 0; $retorno['qtd'] = $sql->rowCount(); while($ln = $sql->fetchObject()){ $retorno['pais'][$n] = $ln->pais; $retorno['id'][$n] = $ln->id; $n++; } } if($_GET['acao'] == 'estado'){ $id = $_GET['id']; $sql = $pdo->prepare("SELECT * FROM estados WHERE id_pais = :id"); $sql->bindValue(":id", $id, PDO::PARAM_INT); $sql->execute(); $n = 0; $retorno['qtd'] = $sql->rowCount(); while($ln = $sql->fetchObject()){ $retorno['estado'][$n] = $ln->estado; $retorno['id'][$n] = $ln->id; $n++; } } if($_GET['acao'] == 'cidade'){ $id = $_GET['id']; $sql = $pdo->prepare("SELECT * FROM cidades WHERE id_estado = :id"); $sql->bindValue(":id", $id, PDO::PARAM_INT); $sql->execute(); $n = 0; $retorno['qtd'] = $sql->rowCount(); while($ln = $sql->fetchObject()){ $retorno['cidade'][$n] = $ln->cidade; $retorno['id'][$n] = $ln->id; $n++; } } if($_GET['acao'] == 'contribuinte'){ $id = $_GET['id']; $sql = $pdo->prepare("SELECT * FROM contribuinte WHERE id_cidade = :id"); $sql->bindValue(":id", $id, PDO::PARAM_INT); $sql->execute(); $n = 0; $retorno['qtd'] = $sql->rowCount(); while($ln = $sql->fetchObject()){ $retorno['contribuinte'][$n] = $ln->contribuinte; $retorno['id'][$n] = $ln->id; $n++; } } die(json_encode($retorno)); <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <select name="pais"> <option>Selecione o Pais</option> </select> <select name="estado"> <option>Selecione o Estado</option> </select> <select name="cidade"> <option>Selecione a Cidade</option> </select> <select name="contribuinte"> <option>Selecione o Contribuinte</option> </select> <script src="jquery.js"></script> <script src="funcoes.js"></script> </body> </html>  
    • Por dba.amaro
      Galera, bom dia/tarde/noite, 
       
      Estou desenvolvendo uma aplicação web, porém preciso mostrar algumas informações e os objetos vão mudar de cor / porcentagem, segundo as informações que estão contidas no banco de dados, 
       
      Tenho, algumas ideias, porém não sei nem por onde começar, se alguém puder ajudar, agradeço !!
       
      Um abraço  a todos e bons posts!
×

Informação importante

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