Sub linhas - table

[sopranophp 0]

Olá,

 

Os meus conhecimentos ainda são muito limitados no que toca a javascript, ainda ando a estudar funções e estruturas condicionais e de repetição :P E sei também, acho eu, que o que pretendo fazer é um pouco avançado para o meu nível de conhecimento. Por isso peço a vossa ajuda e orientação :)

 

O que pretendo fazer é o seguinte!

 

Criei um while em php para ele ler os valores de um banco de dados, que vem num array, e consoante o número de linhas que o array tiver ele repete o processo que está aqui embaixo e voilá, temos uma tabela! :)

O segundo <tbody 2> é para criar uma nova sequência de linhas!

 

Qual é o objectivo?

O objectivo é que ele crie uma linha, linha principal, e abaixo dela, caso o usuário precise, crie mais linhas. Que estas ficam associadas à primeira. Por isso, o tbody 1 têm o tbody 2 que lá dentro têm várias linhas, quantas o usuário quiser criar.

 

Primeira dúvida! Como vou fazer isto em javascript? Penso que seja a melhor tecnologia para fazer isto, certo?

Segunda dúvida! A linhas que o usuário criar serão para inserir dados. Uma vez inseridos o user terá que carregar no botão gravar, um em cada linha nova criada. Ao clicar no botão gravar os dados que vão para base de dados serão os que estão na linha onde está o botão mais os dados que estão na linha principal, digamos que seriam os dados que estão no tr2.2 + tr1.1. Como fazo isso?

 

Nota: A segunda dúvida eu julgo que irei resolver com array. Ficando,

 

array(LP1, LP2, LP3, LP4)

LP1=array(LS1,LS2,LS3,LS4,LS5)

LS1=array(4,5,6)

LS2=array(8,9,8)

LS3=array(8,9,8)

LS4=array(8,89,68)

LS5=array(85,9,658)

 

E por aqui vai. Entenda LP1 como Linha Principal, LS1 como Linha Secundária.

Acho que estou a pensar bem!

 

 

Desculpem o testamento mas é que queira expor correctamente a dúvida :) E assim também serve para possíveis aplicações dos colegas!

 

Boa programação e sucesso p/todos

<tbody 1>
	<tr 1.1>
		<td> </td>
		<td> </td>
		<td> </td>
		<td> </td>
	</tr>
	<tbody 2>
		<tr 2.2>
		<td> </td>
		<td> </td>
		<td> </td>
		<td> </td>
	        </tr>
	</tbody>
</tbody>

[Lucas Guima 164]

Uma imagem vale por mil palavras. Essas coisas são explicadas melhor em forma de desenho.

 

Sobre <tbody> dentro de <tbody>, não é correto, você deve criar uma nova tabela.

<table>
    <tbody>
        <tr>
	    <td></td>
        </tr>
	<tr>
            <td>
                <table>
                    <tbody>
                        <tr>
                            <td> </td>
                        </tr>
                    </tbody>
                </table>
            </td>
        </tr>
    </tbody>
</table>

[sopranophp 0]

Olá,

 

Então a lógica que apresentei está correcta? é a melhor?

 

Obrigado pelas dicas

[Lucas Guima 164]

Nem li, cara, tô esperando a imagem.

[sopranophp 0]

Mas eu não tenho imagem :/

[Lucas Guima 164]

Pois faça, uai. Desenhe o que você está tentando.

[sopranophp 0]

Mas para desenhar tenho que esclarecer a questão da programação. Apenas depois é que poderei começar a criar o html e o css.

[Lucas Guima 164]

Não falei em HTML ou CSS, disse apenas para você desenhar (descrever, deixar entrever, transparecer) como você quer estrutura da sua tabela.

[sopranophp 0]

Como já referi preciso que o user quando carregar num botão, que estará um em cada linha da tabela, seja adicionada uma nova linha abaixo da anterior. Quando carregar outra vez no botão seja adicionada uma segunda linha,

Exemplo:

Carrego a tabela com 5 linhas:

Linha 1 - botão(+);

Linha 2 - botão(+);

Linha 3 - botão(+);

Linha 4 - botão(+);

Linha 5 - botão(+);

Ao carregar no botão(+) da Linha 2 o cenário fica o seguinte:

Linha 1 - botão(+);

Linha 2 - botão(+);

Linha 2.1 - botão(edit);

Linha 2.2 - botão(edit);

Linha 3 - botão(+);

Linha 4 - botão(+);

Linha 5 - botão(+);

Penso que isto tenha que ser com javascript! Acho que quando criar a linha 2.1 e 2.2 terei que seguir a lógica de vetores que falei no primeiro post. Estou a pensar bem?

A minha principal dúvida encontra-se como vou fazer aparacer sub-linhas à medida que vou carregando no botão(+).

Obrigado

[Lucas Guima 164]

Como disse, você deve adicionar uma linha e dentro dessa linha uma nova tabela.

[sopranophp 0]

Sim, mas como faço isso com javascript?

[Lucas Guima 164]

Você pode utilizar JS puro ou jQuery.

[sopranophp 0]

Sim, mas existe algum exemplo, artigo? Para me orientar?

 

Agora é que reparei que tinha os link´s :P Vou estudar, thanks

[sopranophp 0]

Já está resolvido! :)

Muito Obrigado

Interessante :) Como eu adiciono novas linhas com javascript o html não aparece no código fonte. Existe forma de ver o novo html que vai sendo criado, através dos botões inserir linha?

 

Sou novo no javascript, por isso conheço pouca coisa....

 

Obrigado

[Lucas Guima 164]

Pela ferramenta de desenvolvimento do navegador (F12).

 

Firefox:

Aba HTML

 

Chrome:

Aba Elementos

 

Internet Explorer:

Deixa quieto...