formulier in tabel
Ik wil een formulier in een tabel opnemen met alleen hidden-input en een zichtbare verzendknop. Dat gaat allemaal prima. Alleen als ik die knop opneem wordt de tabelregels veel te hoog. Zie bijgevoegd codevoorbeeld. Ik wil de ruimte onder de knop kwijt. Iemand enige idee. paddin en margin op 0 in de code heb ik al geprobeerd maar dat lukt niet.
<TABLE BORDER="1">
<TR> <TD>a1</TD> <TD>a2</TD> </TR>
<TR> <TD>b1</TD> <TD>b2</TD> </TR>
</TABLE>
<TABLE BORDER="1">
<TR> <TD>a1</TD> <TD>a2</TD> </TR>
<TR> <TD>b1</TD> <TD style="margin:0px;"><FORM METHOD="post" ACTION="form2mail.php" >
<input type="hidden" value="" name="test0">
<input type="submit" value="wijzig" name="verzend" >
</FORM></TD> </TR>
</TABLE>
<TABLE BORDER="1">
<TR> <TD>a1</TD> <TD>a2</TD> </TR>
<TR> <TD>b1</TD> <TD>b2</TD> </TR>
</TABLE>
<TABLE BORDER="1">
<TR> <TD>a1</TD> <TD>a2</TD> </TR>
<TR> <TD>b1</TD> <TD style="margin:0px;"><FORM METHOD="post" ACTION="form2mail.php" >
<input type="hidden" value="" name="test0">
<input type="submit" value="wijzig" name="verzend" >
</FORM></TD> </TR>
</TABLE>
Line-height
Je zou het ook zonder tabel kunnen doen en een <button> (type="submit") kunnen stylen?
Line-height werkt alleen als ik hem als styling in de verzendknop plak (resultaat halve knop).
Zet ik hem in TR of Form geeft dat geen effect.
Zet ik hem in TR of Form geeft dat geen effect.
Kan je het formulier niet OM de tabel plaatsen?
Nogmaals, als het enige zichtbare element de submit-knop is, waarom geef je die dan geen opmaak? Je hebt de meeste controle over de opmaak hiervan als je een <button> gebruikt. Hoe minder elementen je hebt om op te maken (geen tabel) hoe makkelijker e.e.a. wordt?
Laten we het anders eens omdraaien. Wat heb je nu, en wat lukt er niet / wil je bereiken?
NB het form veld en de input velden hebben zelf ook een marge. Die maken waarschijnlijk de cel groter. Maar nogmaals, waarom heb je uberhaupt een tabel nodig?
Laten we het anders eens omdraaien. Wat heb je nu, en wat lukt er niet / wil je bereiken?
NB het form veld en de input velden hebben zelf ook een marge. Die maken waarschijnlijk de cel groter. Maar nogmaals, waarom heb je uberhaupt een tabel nodig?
Gewijzigd op 31/03/2019 22:06:04 door Thomas van den Heuvel
-Uit een database wordt data opgevraagd middels een querie.
-Het resultaat hiervan wordt weergegeven in een tabel
-De tabel om de volgende reden: de kolommen worden netjes voorzien van een een kopje en alle kolommen worden netjes uitgelijnd verder geen omkijken meer naar.
De bedoeling is om aan de resultaatrijen een updateknop toe te voegen teneinde, het weergegeven record te kunnen veranderen. Deze updateknop ook in de tabel om bovenstaande reden. Alles wordt netjes uitgelijnd.
Het werkt op zich ook prima, alleen de wijzigknop vraagt zoveel ruimte dat de regelhoogte dusdanig hoog wordt dat het geheel er niet mooi uit ziet.
Ik wil dus alle ruimte om de knop kwijt. Althans zodanig verminderen dat ik een normale regelhoogte houd.
Toevoeging op 31/03/2019 23:16:35:
Bijgevoegde voorbeeldjes laten zien wat ik bedoel:
http://andykort.nl/tabel.html
Tabel A: normale weergave
Tabel B: weergave met knop (zonder enig inputveld)
Tabel C: weergave met knop (5 hidden inputvelden)
-Het resultaat hiervan wordt weergegeven in een tabel
-De tabel om de volgende reden: de kolommen worden netjes voorzien van een een kopje en alle kolommen worden netjes uitgelijnd verder geen omkijken meer naar.
De bedoeling is om aan de resultaatrijen een updateknop toe te voegen teneinde, het weergegeven record te kunnen veranderen. Deze updateknop ook in de tabel om bovenstaande reden. Alles wordt netjes uitgelijnd.
Het werkt op zich ook prima, alleen de wijzigknop vraagt zoveel ruimte dat de regelhoogte dusdanig hoog wordt dat het geheel er niet mooi uit ziet.
Ik wil dus alle ruimte om de knop kwijt. Althans zodanig verminderen dat ik een normale regelhoogte houd.
Toevoeging op 31/03/2019 23:16:35:
Bijgevoegde voorbeeldjes laten zien wat ik bedoel:
http://andykort.nl/tabel.html
Tabel A: normale weergave
Tabel B: weergave met knop (zonder enig inputveld)
Tabel C: weergave met knop (5 hidden inputvelden)
Een float: left; op die input velden lost je probleem waarschijnlijk op.
EDIT: overigens heeft bijna elke browser tegenwoordig een CSS-inspector die meestal te vinden is onder de F12-functietoets. Hiermee kun je elementen inspecteren en de CSS in real time aanpassen.
Hiermee kun je dit soort problemen snel localiseren, dingen uitproberen en ook oplossen.
EDIT: overigens heeft bijna elke browser tegenwoordig een CSS-inspector die meestal te vinden is onder de F12-functietoets. Hiermee kun je elementen inspecteren en de CSS in real time aanpassen.
Hiermee kun je dit soort problemen snel localiseren, dingen uitproberen en ook oplossen.
Gewijzigd op 31/03/2019 23:37:46 door Thomas van den Heuvel
Zo kan ook:
Code (php)
1
2
3
4
5
6
2
3
4
5
6
<TABLE BORDER="1">
<TR> <TD>a1</TD> <TD>a2</TD> </TR>
<TR> <TD>b1</TD> <TD style="background-color:gray;cursor:pointer;" onclick="document.getElementById('formulier').submit();"><FORM METHOD="post" id="formulier" ACTION="form2mail.php" >
<input type="hidden" value="" name="test0">wijzig
</FORM></TD> </TR>
</TABLE>
<TR> <TD>a1</TD> <TD>a2</TD> </TR>
<TR> <TD>b1</TD> <TD style="background-color:gray;cursor:pointer;" onclick="document.getElementById('formulier').submit();"><FORM METHOD="post" id="formulier" ACTION="form2mail.php" >
<input type="hidden" value="" name="test0">wijzig
</FORM></TD> </TR>
</TABLE>
Zoals al eerder werd vermeld : een TABLE in een FORM
Zo iets :
Zo iets :
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
A:
<table border="1">
<tr> <td>a1</td> <td>a2</td> </tr>
<tr> <td>b1</td> <td>b2</td> </tr>
</table>
B:
<form method="post" action="form2mail.php">
<table border="1">
<tr><td>a1</td><td>a2</td></tr>
<tr><td>b1</td><td>
<input type="submit" value="wijzig" name="verzend" />
</td></tr>
</table>
</form>
C:
<form method="post" action="form2mail.php">
<table border="1">
<tr><td>a1</td><td>a2</td></tr>
<tr><td>b1</td><td>
<input type="hidden" name="a" />
<input type="hidden" name="b" />
<input type="hidden" name="c" />
<input type="hidden" name="d" />
<input type="hidden" name="e" />
<input type="submit" value="wijzig" name="verzend" />
</td></tr>
</table>
</form>
<table border="1">
<tr> <td>a1</td> <td>a2</td> </tr>
<tr> <td>b1</td> <td>b2</td> </tr>
</table>
B:
<form method="post" action="form2mail.php">
<table border="1">
<tr><td>a1</td><td>a2</td></tr>
<tr><td>b1</td><td>
<input type="submit" value="wijzig" name="verzend" />
</td></tr>
</table>
</form>
C:
<form method="post" action="form2mail.php">
<table border="1">
<tr><td>a1</td><td>a2</td></tr>
<tr><td>b1</td><td>
<input type="hidden" name="a" />
<input type="hidden" name="b" />
<input type="hidden" name="c" />
<input type="hidden" name="d" />
<input type="hidden" name="e" />
<input type="submit" value="wijzig" name="verzend" />
</td></tr>
</table>
</form>
float-left werkt niet.
Ik heb je bovenstaande code geprobeerd, daarmee krijg ik hetzelfde resultaat als daarvoor (te hoge rijen)
Als ik echter Line-Height in de betreffende TR plak werkt deze nu wel en in de andere situaties niet. Dus is al een eind bruikbaar. Bedankt.
Ik heb je bovenstaande code geprobeerd, daarmee krijg ik hetzelfde resultaat als daarvoor (te hoge rijen)
Als ik echter Line-Height in de betreffende TR plak werkt deze nu wel en in de andere situaties niet. Dus is al een eind bruikbaar. Bedankt.
Als je een voorbeeldje online zet of even de URL geeft van het formulier, dan ben je waarschijnlijk binnen 10 minuten geholpen. Het is nu een beetje 'gokken' wat er misgaat.
Gewijzigd op 01/04/2019 11:31:04 door Ozzie PHP
Andy Kort op 01/04/2019 11:27:06:
float-left werkt niet.
Ik heb je bovenstaande code geprobeerd, daarmee krijg ik hetzelfde resultaat als daarvoor (te hoge rijen)
Ik heb je bovenstaande code geprobeerd, daarmee krijg ik hetzelfde resultaat als daarvoor (te hoge rijen)
Weet niet wat je precies gedaan hebt en/of welke browser jij gebruikt, maar als ik een float: left; op de exacte code van jouw inputvelden toepas (specifiek: regel 13 en 27) gaat het hier goed:
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
A:
<TABLE BORDER="1">
<TR> <TD>a1</TD> <TD>a2</TD> </TR>
<TR> <TD>b1</TD> <TD>b2</TD> </TR>
</TABLE>
B:
<TABLE BORDER="1">
<TR> <TD>a1</TD> <TD>a2</TD> </TR>
<TR > <TD>b1</TD> <TD ><FORM METHOD="post" ACTION="form2mail.php">
<input type="submit" value="wijzig" name="verzend" style="float: left;">
</FORM></TD> </TR>
</TABLE>
C:
<TABLE BORDER="1">
<TR> <TD>a1</TD> <TD>a2</TD> </TR>
<TR > <TD>b1</TD> <TD ><FORM METHOD="post" ACTION="form2mail.php">
<input type="hidden" name ="a">
<input type="hidden" name ="b">
<input type="hidden" name ="c">
<input type="hidden" name ="d">
<input type="hidden" name ="e">
<input type="submit" value="wijzig" name="verzend" style="float: left;">
</FORM></TD> </TR>
</TABLE>
<TABLE BORDER="1">
<TR> <TD>a1</TD> <TD>a2</TD> </TR>
<TR> <TD>b1</TD> <TD>b2</TD> </TR>
</TABLE>
B:
<TABLE BORDER="1">
<TR> <TD>a1</TD> <TD>a2</TD> </TR>
<TR > <TD>b1</TD> <TD ><FORM METHOD="post" ACTION="form2mail.php">
<input type="submit" value="wijzig" name="verzend" style="float: left;">
</FORM></TD> </TR>
</TABLE>
C:
<TABLE BORDER="1">
<TR> <TD>a1</TD> <TD>a2</TD> </TR>
<TR > <TD>b1</TD> <TD ><FORM METHOD="post" ACTION="form2mail.php">
<input type="hidden" name ="a">
<input type="hidden" name ="b">
<input type="hidden" name ="c">
<input type="hidden" name ="d">
<input type="hidden" name ="e">
<input type="submit" value="wijzig" name="verzend" style="float: left;">
</FORM></TD> </TR>
</TABLE>
Werkt i.i.g. in IE en Chrome.
Gewijzigd op 01/04/2019 15:15:41 door Thomas van den Heuvel
Vreemd. Kennelijk had ik hem dan toch niet goed geplaatst. Het werkt hier inderdaad ook prima. Ik ben er mee geholpen en kan verder. Zeer bedankt.
Met vr. groet
Met vr. groet




