Tenho respondido muito essa dúvida ultimamente. É o seguinte, se você tiver que usar formulários e tabelas, isso aqui:
<table>
<form>
<tr> ...
É código inválido, errado, e não funciona no Firefox. Quando ele encontra a tag tr, ele fecha automaticamente o form para você. É como se você estivesse criando um formulário vazio e colocando uma série de campos na tabela fora do formulário. Se você tem um submit comum, não via conseguir nem submeter o formulário. Se submete via javascript, por exemplo, ao final da função de validação, vai dar submit num formulário vazio. Não chega nada no server-side. O certo é fazer:
<form>
<table>
<tr> ...
A gente usava do jeito anterior na era pré-Tableless, porque sem CSS era impossível remover aquele espaço antes e depois do formulário. Vício do século passado, do qual você precisa se livrar. Hoje, basta:
form {
margin: 0;
}
Ah, sim, se você validar seu código, vai detectar esse problema. Mais uma razão para validar.
Quem trabalha com Firefox sabe como as extensões podem mudar a vida de um desenvolvedor. Nós separamos algumas extensões e sugerimos para você. Confira.
Leia maisO desenvolvimento com wordpress vem crescendo e sua plataforma está ficando mais robusta a cada dia. Por isso preparamos alguns artigos e tutoriais sobre desenvolvimento e implemetação de Wordpress em sites.
Leia maisHoje não é sorte. Colocar um site em uma boa colocação no Google não é fácil e muitas vezes pode ser uma dor de cabeça sem tamanho. Por isso, manter um código organizado e simples é um bom começo. Separamos algumas dicas para que você consiga otimizar seu código e fazer algumas modificações nos seus sites para que eles não fiquem atrasados.
Leia maisNós falamos muito sobre XHTML e CSS. Então, nada mais justo que ter um lugar onde você consiga aprender melhor as técnicas e metodologias de desenvolvimento com CSS e XHTML.
Leia mais
2003 - 2009, tableless.com.br
Quase todos os direitos reservados.
.
graças a deus nunca tive o azar de aprender da forma errada… hehe
por extinto parece até lógico que a tag form tem que vir antes do table, mas infelizmente muita gente ainda se confunde…. acho que tem a ver com o hábito de utilizar tabelas no layout e estar acostumado com o fato de que “tudo vai dentro da tabela”. Logo o formulário deve ir dentro da tabela também.
Bastante útil a dica para quem ainda se engana
aliás, só uma sugestão mais relativa ao layout do blog (que eu gostei bem mais desse jeito), não seria interessante colocar um estilo nos “inputs” do formulário de comentários? pra ficar mais parecido com o textarea pelo menos.
abraço!
Nada como recorrer a quem sabe.
Eu tenho esse vício podre e tenho feito coisas funcionarem nessa base, mas a exeplo do problema de hoje, campos criados dinamicamente simplesmente não são “enxergados” e não são enviados para o outro lado.
Mas concordo, funcionando ou não, o código está errado e basta um css pra resolver o espaçamento tosco do form. Preguiça mata
Ótima dica.
Estruturação de hierarquia é o mais importante.
acabando com velhos vicios isso ai
apoiado, companheiro cruj (rs)
Além de tudo, fazer form com tabelas não é lá muito recomendável… o_O
Legal o artigo , eu não saberia como fazer um form bem apresentável sem tabela , podia fazer um artigo sobre isso, inclusive com uma opinião sobre formularios com muitos campos , o melhor é usar tudo em uma coluna ? ou colocar varios campos por linha
Muito boa a dica!! Parabéns! Eu também praticava isso.
Abraços!
Não vejo porque usar
table, e nãoul, ouol…Sinceramente, acho que ficou faltando uma parte do post. A parte em que você explica a maneira (ou uma das) mais sensata de se construir formulários.
Eu não acredito que estou lendo isto! E bem AQUI. Onde eu aprendi muita coisa sobre Tableless Web Standard, agora eu li que o camarada faz seus formulários com tabelas, e outros ainda que fazem com listas!!! Gente, vocês não estão se esquecendo da Sra. Semântica não?
- para dados tabulares;
- para listas(em texto).
Deixa só o Henrique P. ver este texto.
Concordo com o Rubini, falta a parte em que você explica como faz o formulário corretamente.
muita gente hj em dia, ainda não se preocupa com padrões como esse… só quero ver qdo lançarem o IE7, e o pessoal começar a usar bastante… a quantidade de erros q vai ter será impressionante…
Engreçado, falam tanto de padrões, css válidos, e quando ví o resultado da validação do site a primeira coisa que me veio a cabeça foi: faça oque eu digo, não faça oque eu faço.
com certeza web standards é algo muito bom.
mais e os conceitos de IHC onde ficam, existem vários conceitos que mandam muita coisa aplicada em tableless por espaço… como esse botão “Fala!”… totalmente errado… se for feita uma avaliação de interface, meus pesames meus amigos… web standards não é tudo
acho que o exemplo do post não se refere exatamente a construção de formulários, eu cai numa situação dessa mas não pra construir o formulario, por que havia uma tabulação de dados na qual eu precisava de alguns campos dentro da tabela…
mas ainda tenho uma duvida, minha pegunta é, e se eu precisar de mais de 1 formulario na mesma tabela…
e só achei um pouco estranho pq eu só precisava das primeiras linhas com formulario e para isso teria que colocar a tabela inteira dentro do form =/
orbrigado, [][]’s
Eu já tive problemas com as tags de comentário e xhtml-strict. Não é possível colocar tags de comentário — por algum motivo obscuro pelo visto, já que estas tags não participam da renderização da página — fora da tag body.
Experimentem, o browser acusa um erro na folha de estilos XML.
Nossa! Realmente era horrível ter que colocar a tag entre a TR, mas era o único jeito. Tempos “modernos”…
Essa dica me salvou! Muito obrigado! Agora o form fica idêndico no IE e no Firefox.
Nossa cara! Eu havia colocado o dentro de um table e quando enviava no FF ele não pegava o valor dos inputs criados dinâmicamente, enquanto que no IE ia normal.
Coloquei o ANTES da table e agora funciona normalmente! E eu tava quebrando a cabeça tentando entender porque funcionava em localhost mas no servidor não.
Valeu mesmo!
Um abraço!