Jump to content
vinitf

JSon Adicionar novas arrays

Recommended Posts

Tenho um input para o usuário escolher quantos números vão estar no array e estou tentando colocar outro agora para ele escolher a quantidade de arrays que vai gerar através de JSON, mas estou tendo dificuldades. 

<html>

<input  placeholder ="Quantidade de elementos" id="quantidadeElementos" />
<input placeholder ="Quantidade de listas" id="quantidadelistas"/>
<button onclick="myFunction()">Gerar</button>
<p id="gerar"></p>
<p id="demo"></p>
</html>

 

<script>

function myFunction() {
  var listas = {
    listainicial: [],
    nova: []
  };
  var max = document.getElementById("quantidadeElementos").value || 5;
  for (var i = 0; i < max; i++) {
    listainicial.push(parseInt(Math.random() * 100));
    var n = document.getElementById("quantidadelistas").value || 5;
    for (var n = 0; n < max; n++) {
      listainicial.push(parseInt(Math.random() * 100));
      listas.listainicial.push({
        outra: []
     });
   }
    document.getElementById("gerar").innerHTML = listainicial;
    document.getElementById("demo").innerHTML = nova;
  }
  document.getElementById("botão").addEventListener("click", myFunction);
}

</script> 

Share this post


Link to post
Share on other sites

Não sei se entendi bem.

 

Você quer uma saída assim?

Array[10]
	0: Array[10]
		0 : 46
		1 : 13
		2 : 71
		3 : 88
		....
	1: Array[10]
		0 : 55
		1 : 20
		2 : 10
		3 : 5
		....

 

 

<!DOCTYPE HTML>
<html>
<head>
	<meta charset="UTF-8">
	<title></title>
</head>
<body>



<script>

	var qntArrays = 5;
	
	var lista = [];	
	for(var i = 0; i < 10; i++){
		lista[i] = [];
		
		for(var y = 0; y < 10; y++){					
			var rand = parseInt(Math.random() * 100);			
			lista[i][y] = rand;
		}
	}
	
	console.log(lista);
	
</script>
</body>
</html>

 

Algumas dicas.

Se atente ao HTML semântico/correto/valido.

 

 

1-    

<input  placeholder ="Quantidade de elementos" id="quantidadeElementos" />

Prefira:

<input type="text" placeholder ="Quantidade de elementos" id="quantidadeElementos" />

(Ausencia do campo type atrapalha) 

Ou melhor ainda utilize os tipos 'tel/number' do padrão de HTML5

Mais:

https://diveintohtml5.com.br/

 

 

2 - 
O JavaScript deveria ficar antes do fechamento da tag
</body>

Mais:

https://www.eventials.com/pinceladasdaweb/javascript-boas-praticas-e-otimizacoes/

 

3 - 
A tag <body></body> Simplesmente não existe no seu documento.


4 - Utilize o botão 'Code' ao postar cógidos Html/Js/CSS/*....
 

5-

Recomendo os exercícios:

https://github.com/gabrieldarezzo/helpjs-ravi

 

 

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

  • Similar Content

    • By lucianfpaula
      Olá saudações, tenho a seguinte duvida, dentro de uma div vou ter varios campos de texto, seja h1, p, smaill etc.. a minha duvida é a seguinte: como manipular a cor de um texto selecionado, tipo tenho um <h1>Minha texto que pode ser grande, quero mudar essa cor</h1> tem varios editor que usam textarea, mas queria saber se é possivel fazer isso a partir de qualquer tag. tipo seleciono o texto e clico em um botão com a cor que quero e mude o texto selecionado.
       
      Muito obrigado
    • By peterstefan
      Bom dia, estou fazendo uma cadastro via rest e estou utilizando o curl para cadastrar no webservice...
      Meu código está cadastrando tudo certinho, porem quando ele cadastra e mostra o retorno que foi cadastrado com sucesso ele fica o AGUARDE, CARREGANDO e não para.. não sei oque esta faltando pq já tentei varias coisas e não deu certo... 
       
       
       
      $Data = [ "nomeRazaoSocial" => $PostData['nomeRazaoSocial'], "identMF" => $PostData['identMF'], "email" => $PostData['email'], "telefone" => $PostData['telefone'], "senhaProvisoria" => $PostData['senhaProvisoria'] ]; $DataString = json_encode($Data); $curl = curl_init(WEBSERVICECADASTRO); curl_setopt($curl, CURLOPT_CUSTOMREQUEST, "POST"); curl_setopt($curl, CURLOPT_POSTFIELDS, $DataString); curl_setopt($curl, CURLOPT_RETURNTRANSFER, true); curl_setopt($curl, CURLOPT_HTTPHEADER, array( 'Content-Type: application/json', 'Content-Length: ' . strlen($DataString)) ); $result = curl_exec($curl); if ($result) { $jSON['success'] = "<i class='icon-checkmark'></i>Pronto, cadastro foi realizado com sucesso!"; }else{ $jSON['error'] = "<i class='icon-warning'></i>Oops! Erro ao cadastrar! Por favor, tente novamente!"; }  

       

    • By Augustomesquita
      Bom dia pessoal!
      Vocês também estão programando em primeira pessoa? Recentemente escrevi este artigo e gostaria de compartilhar a ideia com vocês.
      Pare de programar em primeira pessoa!
    • By DunkMask
      Olá, boa tarde.
       
      estou enfrentando um probleminha aqui. estou criando um teste aqui para inserir um canvas em um mapa e o angulo que ele esta entrando nao esta bacana, então preciso alterar ele.
       
      Mas acontece que ao usar o context.rotate() ele esta distorcendo todo o meu desenho e nao rotaciona o todo.
      Estou passando posição x e y, o _M_ seria o tamanho do desenho referente ao zoom do mapa e o tipo é um indicador qualquer e  para posicionar ele no mapa, até ai tudo bem, funciona perfeitamente, mas quando tento rotacionar que o problema começa.
      function poste(pX, pY, _M_, context,tipo){ context.strokeStyle = '#000000'; context.lineWidth = 1; context.lineJoin = 'round'; context.lineCap = 'round'; context.style(). switch(tipo) { case 1: context.beginPath(); context.arc(pX+(12.5 * _M_), pY+(6 * _M_), 17 * _M_, 111.2 * (Math.PI / 180), 68.8 * (Math.PI / 180), true); context.stroke(); context.beginPath(); context.arc(pX+(41.9 * _M_), pY+(12.5 * _M_), 25 * _M_, 158 * (Math.PI / 180), 202 * (Math.PI / 180), false); context.stroke(); context.beginPath(); context.arc(pX+(12.5 * _M_), pY+(19 * _M_), 17 * _M_, 291.3 * (Math.PI / 180), 248.8 * (Math.PI / 180), true); context.stroke(); context.beginPath(); context.arc(pX+(-16.9 * _M_), pY+(12.5 * _M_), 25 * _M_, 22 * (Math.PI / 180), 338 * (Math.PI / 180), true); context.stroke(); break; } } Alguém pode me dar uma luz, eu tento inserir o rotate no final de todas as linhas ele buga, tento inserir no começo e ele buga, ou se eu insiro fora do switch ele buga.
       
      se puderem me apontar uma solução eu agradeço
    • By tiagosp
      Estou gerando uma tabela no corpo html com javascript
      function responseAllHours(ObJson){ //Função que trabalha com multiplas arrays e elementos var ObJS = JSON.parse(ObJson); var divMain = document.getElementById("main"); var constructor = '<table><thead><tr><th colspan="3">Lista de horários</th></tr><tr><th colspan="1">Semana</th><th colspan="1">Sábado</th><th colspan="1">Domingo</th></tr></thead><tbody>'; var lista1 = ObJS[0].split(","); var lista2 = ObJS[1].split(","); var lista3 = ObJS[2].split(","); for(i = 0; i <= lista1.length -1; i++){ constructor += '<tr id="list' + i + '">' + '<td>' + lista1[i] + '</td>'; } constructor += '</tbody></table>'; divMain.innerHTML = constructor; for(i=0; i <= lista2.length -1; i ++){ document.getElementById("list" + i).innerHTML = '<td>' + lista2[i] + '</td>'; } for(i=0; i <= lista3.length -1; i ++){ document.getElementById("list" + i).innerHTML = '<td>' + lista3[i] + '</td>'; } } Porém as duas ultimas partes não estão sendo construídas:
      for(i=0; i <= lista2.length -1; i ++){ document.getElementById("list" + i).innerHTML = '<td>' + lista2[i] + '</td>'; } for(i=0; i <= lista3.length -1; i ++){ document.getElementById("list" + i).innerHTML = '<td>' + lista3[i] + '</td>'; } Então resolvi dar um break antes de chegar nos dois últimos laços, e para minha surpresa, a tabela não é montada antes do fim da função, logo o "document.getElementById" não localiza o elemento...
      Então estou sem saber o que fazer. Gostaria de ressaltar que solicito a montagem da tabela antes de iniciar os próximos laços ("divMain.innerHTML = constructor;")
×

Important Information

Ao usar o fórum, você concorda com nossos Terms of Use.