[Resolvido] Formulário com ou sem tabelas?

[Super_Zica_Man 0]

Todos falam que tabelas foram feitas para lidar com dados tabulares, mas ai fica minha dúvida, se eu usá-la para alinhar um formulário, estaria fazendo errado?

[Giovani 104]

O bom senso predomina Super_Zica_Man.

 

Se você tem que entregar para ontem, e você só sabe fazer com tabela, vai em frente. Isso não é nenhum pecado.

Claro que alguns puristas em css dirão que isso é um crime, mas nem liga.

 

Se tiver tempo, e se quiser, procure e estude sobre os formulários.

Aqui no fórum tem vários tópicos sobre isso.

 

http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

[brcontainer 16]

Bem eu sei que é dificil fazer o formulario sem tabelas mas se quiser alguns exemplos sem tabelas:

http://forum.imasters.com.br/index.php?showtopic=293455

http://forum.imasters.com.br/index.php?showtopic=279679

 

Boa sorte ;)

[Super_Zica_Man 0]

Ok, vou dar uma olhada estava fazendo sem tabelas e usando o plugin do JQuery NiceForms, só que o maior problema é o espaçamento das caixas de texto ficava muitos   na página

[brcontainer 16]

Não deve-se usar  

 

leia os tópicos que você vai ver como fazer sem usar esses espaçamentos.

[Guilherme Rambo 4]

Recomendo a leitura dos posts informados pelo Silverfox. É muito fácil formatar um formulário sem tabelas

 

[]'s

[Super_Zica_Man 0]

Ok, valeu as dicas, só mais uma coisa.

E quanto aos campos menores quando eu colocar um do lado do outro não vai ficar bem alinhado, como seria a melhor forma de organizar um formulário?

[Henrique Barcelos 290]

http://forum.ievolutionweb.com/index.php?showtopic=15926

 

dah uma olhada aew...

 

att, rick

[Aprendiz CSS 3]

formulario deve ser sem tabela

 

e gosto de englobar cada campo com uma div

 

<div>
	 <label for="nome">Nome</label>
	 <input type="text" name="nome" id="nome" />
</div>

abraço

[Rasp 3]

Opa Aprendiz...

Cara só completando o que você disse... dependendo do projeto não há necessidade de englobar os campos com divs... principalmente se for um grande formulário... você estaria sendo "um div maniaco" mais isso é válido com certeza... já usei várias vezes inclusive.

 

Abss

[Aprendiz CSS 3]

Opa Aprendiz...

Cara só completando o que você disse... dependendo do projeto não há necessidade de englobar os campos com divs... principalmente se for um grande formulário... você estaria sendo "um div maniaco" mais isso é válido com certeza... já usei várias vezes inclusive.

 

Abss

Não concordo com isso não!

 

uso div porque dentro de um formulario é o elemento mais correto de se utilizar

 

poderia usar um paragrafo, mas ao meu entender não seria a melhor coisa a se fazer!

 

sem contar que se eu não usar um elemento englobando o label e o input complicaria minha vida quando um input fosse menor que o padrão.

 

ficaria em cascata o formulario.

 

abraço

[Rasp 3]

Sim entendo... porém o que disse é uma questão que já vi várias vezes abordada pelos forúns... o exagero no uso de divs... acaba poluindo seu código e com tempo consideravelmente reduz sua indexação em sites de busca.

 

Não disse que sua forma é incorreta, mais dei um ponto de vista que você pode ou não, utilizar e garanto que tem pessoas que apoiam tanto seu metodo quanto o meu.

 

Meu intuito com o comentário foi somente para você ver que pode otimizar seu cod... derrepente usando a div somente onde é necessário ao invés de todo form.

 

Enfim é isso.

[Giovani 104]

Você está errado utilizando uma div para cada campo, o Rasp tem toda a razão.

Agora, se você não quer complicar sua vida utilize uma div para cada campo...ou.....faça o formulário com tabela.

 

formulario deve ser sem tabela

 

e gosto de englobar cada campo com uma div

 

<div>
	 <label for="nome">Nome</label>
	 <input type="text" name="nome" id="nome" />
</div>

abraço

[Aprendiz CSS 3]

Sim entendo... porém o que disse é uma questão que já vi várias vezes abordada pelos forúns... o exagero no uso de divs... acaba poluindo seu código e com tempo consideravelmente reduz sua indexação em sites de busca.

 

Não disse que sua forma é incorreta, mais dei um ponto de vista que você pode ou não, utilizar e garanto que tem pessoas que apoiam tanto seu metodo quanto o meu.

 

Meu intuito com o comentário foi somente para você ver que pode otimizar seu cod... derrepente usando a div somente onde é necessário ao invés de todo form.

 

Enfim é isso.

Entendido!!!

 

 

 

Você está errado utilizando uma div para cada campo, o Rasp tem toda a razão.

Agora, se você não quer complicar sua vida utilize uma div para cada campo...ou.....faça o formulário com tabela.

 

formulario deve ser sem tabela

 

e gosto de englobar cada campo com uma div

 

<div>
	 <label for="nome">Nome</label>
	 <input type="text" name="nome" id="nome" />
</div>

abraço

Agora fiquei curioso!!!

 

Li em um site que a forma que eu disse é legal, porem o cara usava paragrafo, paragrafo não é semanticamente correto em formularios!

 

por isso coloquei a div, utilizei div por se tratar de um elemento que serve para dividir, utilizar em nivel de bloco sem alterar o comportamento

 

tabela complica muito mais, quero fazer da forma correto

 

 

sem cair em divmania e classemania

 

abraço

[Giovani 104]

Tem vários sites, vários blogs que escrevem um monte de besteira.

De todos os meus anos de estudo de css não lembro de ter visto formulários com <p> ou com <div>.

 

Aqui no fórum tem bastante link sobre isso, e nehum da forma que você passou, veja este ótimo exemplo: http://forum.imasters.com.br/index.php?showtopic=293455

Tem o do site do maujor também: http://www.maujor.com/tutorial/formac-a.php

 

Não estou dizendo que você está errado. Como já deixei claro, o bom senso sempre predomina.

Mas fazendo como você mostrou, se tivermos 50 campos num forumlário, teremos 50 divs?

Isso para mim é muita div.

 

http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

[Aprendiz CSS 3]

Concordo que é muita div

 

eu sei que todos os que aqui foram mostrados são de forma diferente do que eu fiz!

 

eu não lembro mesmo onde vi!

 

mas valeu pela dica, começarei a fazer diferente!

 

talvez melhore o meu desempenho nos projetos!

 

abraço

[Guilherme Rambo 4]

Após um bom tempo trabalhando com sites nos padrões, a melhor estrutura HTML de formulários que consegui alcançar foi a seguinte:

 

<form id="form1" action="" method="post">
<fieldset>
<legend>Preencha os campos</legend>

<label for="campo1">
	<span>Campo 1:</span>
	<input type="text" name="campo1" value="" id="campo1">
</label>

	<label for="campo2">
	<span>Campo 2:</span>
		<input type="text" name="campo2" value="" id="campo2">
	</label>

<label for="campo3">
	<span>Campo 3:</span>
	<input type="text" name="campo3" value="" id="campo3">
</label>

<button type="submit">Ok</button>
</fieldset>
</form>

 

Esta estrutura, além de ser semanticamente correta, permite um nível muito bom de personalização na aparência. Caso necessite de ainda mais personalização, seguindo a idéia de que um formulário é uma lista de campos a serem preenchidos, você pode utilizar uma lista não-ordenada:

 

<form id="form1" action="" method="post">
<fieldset>
<legend>Preencha os campos</legend>

<ul id="campos">
	<li>
		<label for="campo1">
			<span>Campo 1:</span>
			<input type="text" name="campo1" value="" id="campo1">
		</label>
	</li>

	<li>
	 	<label for="campo2">
			<span>Campo 2:</span>
	 		<input type="text" name="campo2" value="" id="campo2">
	 	</label>		
	</li>

	<li>
		<label for="campo3">
			<span>Campo 3:</span>
			<input type="text" name="campo3" value="" id="campo3">
		</label>		
	</li>
</ul>

<button type="submit">Ok</button>
</fieldset>
</form>

 

[]'s

[Aprendiz CSS 3]

Eu não concordo muito com esta forma!

 

devido a este argumento aqui

http://www.w3schools.com/tags/tag_label.asp

 

talvez seria melhor fazer dessa forma aqui

 

<label for="nome">Nome</label>
<input type="text" name="nome" id="nome" />

abraço

[Guilherme Rambo 4]

Esta forma tem algumas incompatibilidades com browsers. A outra ainda proporciona um melhor controle sobre o visual dos elementos.

 

[]'s

[William Bruno 1501]

<label> por definição e utlidade, define a area clicável para dado campo de um formulário.

<label> e <input /> são elementos inline... não existe nenhum problema em colocar o input dentro do label.

 

Grupos de labels são feitos com fieldsets... definidos com teus proprios legends... e por fim o nivel de bloco maior: o <form>!

sim, muitas pessoas esquecem que podem estilizar diretamente a tag form, e se perdem com excesso de divs.. assim como o ul é um nivel de bloco muito bom, e vejo pessoas fazendo DIVs para englobar a UL do menu.. só por não ter conseguido estilizar a UL.

Porque não fazer:

<label for="campo"><input id="campo" /></label> ?

 

Nunca vi ninguém dizendo isso ser errado. E nem há motivos para isso.

Redundância?

Digo que não, apenas uma retrocompatibilidade ainda necessária. E menos "carregada" doque o uso de DIVs que não são próprias para formulário.