formulier in tabel

Overzicht Reageren

Sponsored by: Vacatures door Monsterboard

Andy Kort

Andy Kort

31/03/2019 13:49:18
Quote Anchor link
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>
 
PHP hulp

PHP hulp

23/04/2024 19:50:51
 
- SanThe -

- SanThe -

31/03/2019 14:18:03
Quote Anchor link
Line-height
 
Thomas van den Heuvel

Thomas van den Heuvel

31/03/2019 16:54:18
Quote Anchor link
Je zou het ook zonder tabel kunnen doen en een <button> (type="submit") kunnen stylen?
 
Andy Kort

Andy Kort

31/03/2019 17:24:19
Quote Anchor link
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.
 
- Ariën  -
Beheerder

- Ariën -

31/03/2019 18:28:07
Quote Anchor link
Kan je het formulier niet OM de tabel plaatsen?
 
Thomas van den Heuvel

Thomas van den Heuvel

31/03/2019 22:05:47
Quote Anchor link
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?
Gewijzigd op 31/03/2019 22:06:04 door Thomas van den Heuvel
 
Andy Kort

Andy Kort

31/03/2019 23:08:03
Quote Anchor link
-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)
 
Thomas van den Heuvel

Thomas van den Heuvel

31/03/2019 23:28:36
Quote Anchor link
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.
Gewijzigd op 31/03/2019 23:37:46 door Thomas van den Heuvel
 
- SanThe -

- SanThe -

01/04/2019 08:54:52
Quote Anchor link
Zo kan ook:
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
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>
 
Adoptive Solution

Adoptive Solution

01/04/2019 11:25:23
Quote Anchor link
Zoals al eerder werd vermeld : een TABLE in een FORM

Zo iets :

Code (php)
PHP script in nieuw venster Selecteer het PHP script
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
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>
 
Andy Kort

Andy Kort

01/04/2019 11:27:06
Quote Anchor link
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.
 
Ozzie PHP

Ozzie PHP

01/04/2019 11:30:50
Quote Anchor link
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
 
Thomas van den Heuvel

Thomas van den Heuvel

01/04/2019 15:14:30
Quote Anchor link
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)

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)
PHP script in nieuw venster Selecteer het PHP script
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
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>

Werkt i.i.g. in IE en Chrome.
Gewijzigd op 01/04/2019 15:15:41 door Thomas van den Heuvel
 
Andy Kort

Andy Kort

01/04/2019 19:08:09
Quote Anchor link
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
 



Overzicht Reageren

 
 

Om de gebruiksvriendelijkheid van onze website en diensten te optimaliseren maken wij gebruik van cookies. Deze cookies gebruiken wij voor functionaliteiten, analytische gegevens en marketing doeleinden. U vindt meer informatie in onze privacy statement.