Form in zelfvullende table

Pagina: 1
Acties:

Vraag


Acties:
  • 0 Henk 'm!

  • ProAce
  • Registratie: Januari 2014
  • Laatst online: 06-10 15:19
Ik ben bezig met een html/php pagina die een tabel maakt vanuit data uit een database. Dit deel lukt en werkt goed. Maar nu wil ik per rij een tweetal select dropdown menu's en een knop toevoegen. Het toevoegen lukt prima, alleen het functioneel krijgen krijg ik niet voor elkaar.

Voor zover ik de structuur begrijp moeten deze selects en buttons in een form staan om de data te kunnen verwerken met php. Dit schijnt alleen niet te werken met een html tabel en werkt ook niet goed samen met de zelf vullende eigenschap van mijn tabel.

Mijn vraag is; Hoe maak ik het zo dat elke button de waarden uit die rij van de tabel pakt en kan verwerken naar een database toe?

Onderstaand is het stuk code hoe de tabel is opgebouwd/gevuld.

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
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
<?php
$link = mysqli_connect("","","","");

if($link === false){
  die("ERROR: Could not connect." . mysqli_connect_error());
}

$query = "SELECT * FROM *";

$result = mysqli_query($link, $query);

function funcName(){
  $link = mysqli_connect("","","","");
  $nm = "SELECT * FROM * WHERE *";
  $name = mysqli_query($link, $nm);

  while($row = mysqli_fetch_array($name)):;
    echo "<option value="; echo $row[3];echo ">"; echo $row[3]; echo"</option>";
  endwhile;
}

?>

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
  <meta name="description" content="">
  <meta name="author" content="">

  <title>Klussenlijst</title>

  <!-- Bootstrap core CSS -->
  <link href="vendor/bootstrap/css/bootstrap.css" rel="stylesheet">
</head>

<body>
  <!-- Page Content -->
  <div class="container">
    <table class="table table-striped table-responsive-lg">
      <thead>
        <tr>
          <th>Tijd</th>
          <th>Prio</th>
          <th>Plaats</th>
          <th>Categorie</th>
          <th>Omschrijving</th>
          <th>Binnen</th>
          <th>Door</th>
          <th>Naam</th>
          <th>Klaar</th>
          <th></th>
        </tr>
      </thead>
      <tbody>
      <?php while($row = mysqli_fetch_array($result)):;?>
        <tr>
          <td><?php echo $row[1];?></td>
          <td><?php echo $row[2];?></td>
          <td><?php echo $row[3];?></td>
          <td><?php echo $row[4];?></td>
          <td><?php echo $row[5];?></td>
          <td><?php echo $row[6];?></td>
          <td><?php echo $row[7];?></td>
          <td>
            <select class ="form-control" name="name">
              <option hidden selected></option>
              <?php funcName(); ?>
            </select>
          </td>
          <td>
            <select class="form-control" name="done">
              <option hidden selected></option>
              <option>Ja</option>
              <option>Nee</option>
              <option>Tech</option>
            </select>
          </td>
          <td><button type="submit" class="btn btn-default">Klaar!</button></td>
        </tr>
        <?php endwhile;?>
        </form>
      </tbody>
    </table>
  </div>

  <!-- Bootstrap core JavaScript -->
  <script src="vendor/jquery/jquery.min.js"></script>
  <script src="vendor/bootstrap/js/bootstrap.bundle.min.js"></script>

</body>

</html>

Alle reacties


Acties:
  • 0 Henk 'm!

  • DJMaze
  • Registratie: Juni 2002
  • Niet online
Waar is je <form> ?

Maak je niet druk, dat doet de compressor maar


Acties:
  • 0 Henk 'm!

  • ProAce
  • Registratie: Januari 2014
  • Laatst online: 06-10 15:19
Dat is dus ook deel van mijn vraag, waar zou ik die moeten plaatsen.

Ik heb het geprobeerd om de tablet heen, alleen dan krijg je alle data van alle selects in een keer voor zover ik begreep. Ook heb ik het geprobeerd om een form per rij aan te maken maar ook dit werkte niet.

Acties:
  • 0 Henk 'm!

  • CurlyMo
  • Registratie: Februari 2011
  • Laatst online: 14:34
ProAce schreef op vrijdag 11 mei 2018 @ 12:38:
[...]


Dat is dus ook deel van mijn vraag, waar zou ik die moeten plaatsen.

Ik heb het geprobeerd om de tablet heen, alleen dan krijg je alle data van alle selects in een keer voor zover ik begreep. Ook heb ik het geprobeerd om een form per rij aan te maken maar ook dit werkte niet.
Het lijkt alsof je niet goed weet hoe HTML forms werken. Vanuit die aanname zou ik onderstaande leerstappen willen suggereren:

Stap 1:
Via PHP waardes in een database stoppen.

Stap 2:
HTML formulier waardes op je scherm toveren in PHP middels bijv. een simpele print_r. Dan snap je beter hoe formulieren door PHP behandeld worden.

Stap 3:
Formulier waardes opslaan in een database

Stap 4:
Alles combineren wat je in de TS hebt uitgelegd.

Per stap kan je vragen stellen waar je tegenaan loopt of waar je meer over wilt weten.

Aanvullend:

Na het bekijken van je code nog wat dingen om over na te denken:
- Waarom twee of meer keer een mysql connect?
- Is een duidelijkere functienaam niet handiger?
- Waarom gestapelde echo's i.p.v. strings concatenaten? Kijk eventueel naar de php short echo tag.
- Waarom de punt komma achter je while statements?
- Ik zou een mysql_fetch_assoc doen i.p.v. mysql_fetch_array. Is minder fout gevoelig.

Er zijn overigens best handige standaard (open source tools) voor wat ik denk dat je probeert te bereiken zoals Trello of Taiga.

[ Voor 23% gewijzigd door CurlyMo op 11-05-2018 13:39 ]

Sinds de 2 dagen regel reageer ik hier niet meer


Acties:
  • 0 Henk 'm!

  • DJMaze
  • Registratie: Juni 2002
  • Niet online
Zo werkt het:
HTML:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<form action="">
<select name="kolom1">
</select>
<select name="kolom2">
</select>
<button>filter kolom1 AND kolom2</button>
</form>

<form action="">
<select name="kolom1">
</select>
<button>filter alleen kolom1</button>
</form>

<form action="">
<select name="kolom2">
</select>
<button>filter alleen kolom2</button>
</form>

[ Voor 4% gewijzigd door DJMaze op 22-05-2018 12:09 ]

Maak je niet druk, dat doet de compressor maar


Acties:
  • 0 Henk 'm!

  • ProAce
  • Registratie: Januari 2014
  • Laatst online: 06-10 15:19
CurlyMo schreef op vrijdag 11 mei 2018 @ 12:50:
[...]

Het lijkt alsof je niet goed weet hoe HTML forms werken. Vanuit die aanname zou ik onderstaande leerstappen willen suggereren:

Stap 1:
Via PHP waardes in een database stoppen.

Stap 2:
HTML formulier waardes op je scherm toveren in PHP middels bijv. een simpele print_r. Dan snap je beter hoe formulieren door PHP behandeld worden.

Stap 3:
Formulier waardes opslaan in een database

Stap 4:
Alles combineren wat je in de TS hebt uitgelegd.

Per stap kan je vragen stellen waar je tegenaan loopt of waar je meer over wilt weten.

Aanvullend:

Na het bekijken van je code nog wat dingen om over na te denken:
- Waarom twee of meer keer een mysql connect?
- Is een duidelijkere functienaam niet handiger?
- Waarom gestapelde echo's i.p.v. strings concatenaten? Kijk eventueel naar de php short echo tag.
- Waarom de punt komma achter je while statements?
- Ik zou een mysql_fetch_assoc doen i.p.v. mysql_fetch_array. Is minder fout gevoelig.

Er zijn overigens best handige standaard (open source tools) voor wat ik denk dat je probeert te bereiken zoals Trello of Taiga.
Stap 1 tot en met 4 heb ik op een andere pagina al werkend, alleen kom ik er in combinatie met de tabel er niet uit. Ik heb geprobeerd om in de while loop ook steeds een nieuwe form aan te maken, maar dit zorgt er voor dat alle knoppen werken voor de laatste twee invulvelden. Ook de hele tabel in een form zetten heeft hetzelfde effect.

Ik heb verder geen ervaring met html en php en ben voor mezelf aan het oefenen om daar wat vaardiger in te worden, vandaar dat ik het zelf probeer te maken i.p.v een standaard pakket te gebruiken. Vandaar ook de niet altijd even handig gekozen functies.

Acties:
  • 0 Henk 'm!

  • CurlyMo
  • Registratie: Februari 2011
  • Laatst online: 14:34
ProAce schreef op vrijdag 11 mei 2018 @ 13:51:
[...]
Ik heb geprobeerd om in de while loop ook steeds een nieuwe form aan te maken, maar dit zorgt er voor dat alle knoppen werken voor de laatste twee invulvelden. Ook de hele tabel in een form zetten heeft hetzelfde effect.
Geef eens een voorbeeld?

Sinds de 2 dagen regel reageer ik hier niet meer


Acties:
  • 0 Henk 'm!

  • ProAce
  • Registratie: Januari 2014
  • Laatst online: 06-10 15:19
CurlyMo schreef op vrijdag 11 mei 2018 @ 18:25:
[...]

Geef eens een voorbeeld?
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
36
37
38
39
40
41
42
43
44
45
46
<table class="table table-striped table-responsive-lg">
      <thead>
        <tr>
          <th>Tijd</th>
          <th>Prio</th>
          <th>Plaats</th>
          <th>Categorie</th>
          <th>Omschrijving</th>
          <th>Binnen</th>
          <th>Door</th>
          <th>Naam</th>
          <th>Klaar</th>
          <th></th>
        </tr>
      </thead>
      <tbody>
      <?php while($row = mysqli_fetch_array($result)):;?>
      <form action="<?php echo $_SERVER["PHP_SELF"];?>" method="post">
        <tr>
          <td><?php echo $row[1];?></td>
          <td><?php echo $row[2];?></td>
          <td><?php echo $row[3];?></td>
          <td><?php echo $row[4];?></td>
          <td><?php echo $row[5];?></td>
          <td><?php echo $row[6];?></td>
          <td><?php echo $row[7];?></td>
          <td>
            <select class ="form-control" name="name">
              <option hidden selected></option>
              <?php funcName(); ?>
            </select>
          </td>
          <td>
            <select class="form-control" name="done">
              <option hidden selected></option>
              <option value="Ja">Ja</option>
              <option value="Nee">Nee</option>
              <option value="Tech">Tech</option>
            </select>
          </td>
          <td><button type="submit" class="btn btn-default">Klaar!</button></td>
        </tr>
        </form>
        <?php endwhile;?>
      </tbody>
    </table>


Bij die laatste is mijn logica dat er per regel een nieuwe form aangemaakt word met bijbehorende button. Maar de praktijk blijkt te zijn dat alle knoppen werken voor de laatste form.

Acties:
  • 0 Henk 'm!

  • CurlyMo
  • Registratie: Februari 2011
  • Laatst online: 14:34
Haal eens je al je PHP weg en je tabellen en begin met twee formuleren met één submit en één veld Dat helpt je je probleem te determineren.

Sinds de 2 dagen regel reageer ik hier niet meer


Acties:
  • 0 Henk 'm!

  • _Thanatos_
  • Registratie: Januari 2001
  • Laatst online: 05-09 14:39

_Thanatos_

Ja, en kaal

Ik zou sowieso de <form> om de hele tabel heen zetten. Nergens in een tabel, behalve in <td> en <th> mag nml een <form> voorkomen. Dat is gewoon incorrect, en het is niet slim om erop de vertrouwen dat browsers dat oppikken zoals hoe jij het verwacht.

日本!🎌


Acties:
  • 0 Henk 'm!

  • RM-rf
  • Registratie: September 2000
  • Laatst online: 14:14

RM-rf

1 2 3 4 5 7 6 8 9

ProAce schreef op vrijdag 11 mei 2018 @ 12:08:


Mijn vraag is; Hoe maak ik het zo dat elke button de waarden uit die rij van de tabel pakt en kan verwerken naar een database toe?
om dat te doen zal er een POST/GET request naar de server gedaan moeten worden waar die waardes meegestuurd worden...

Een FORM submit alle waardes die in INPUT, SELECT, CHECKBOXES/RADIO ingevuld zijn

je kunt binnen je while loop iedere keer een form gegenereren, maar minimaal zal deze dan ook bv de ID in een hidden input moeten bevatten om te weten welke row je eigenlijk aanspreekt.
eventueel kun je overigens die ID ook als value van je button meegeven

Intelligente mensen zoeken in tijden van crisis naar oplossingen, Idioten zoeken dan schuldigen


Acties:
  • 0 Henk 'm!

  • DJMaze
  • Registratie: Juni 2002
  • Niet online
Ik zie al waar je heen wil
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
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
<form action="" method="post">
    <table class="table table-striped table-responsive-lg">
        <thead>
            <tr>
                <th>Tijd</th>
                <th>Prio</th>
                <th>Plaats</th>
                <th>Categorie</th>
                <th>Omschrijving</th>
                <th>Binnen</th>
                <th>Door</th>
                <th>Naam</th>
                <th>Klaar</th>
                <th></th>
            </tr>
        </thead>
        <tbody>
        <?php while($row = mysqli_fetch_array($result)) { ?>
            <tr>
                <td><?php echo $row[1];?></td>
                <td><?php echo $row[2];?></td>
                <td><?php echo $row[3];?></td>
                <td><?php echo $row[4];?></td>
                <td><?php echo $row[5];?></td>
                <td><?php echo $row[6];?></td>
                <td><?php echo $row[7];?></td>
                <td>
                    <select class="form-control" name="record[<?php echo $row[0];?>][name]">
                    <option hidden selected></option>
                    <?php funcName(); ?>
                    </select>
                </td>
                <td>
                    <select class="form-control" name="record[<?php echo $row[0];?>][done]">
                    <option hidden selected></option>
                    <option value="Ja">Ja</option>
                    <option value="Nee">Nee</option>
                    <option value="Tech">Tech</option>
                    </select>
                </td>
            </tr>
        <?php } ?>
        </tbody>
        <tfoot>
            <tr>
                <td colspan="0"><button type="submit" class="btn btn-default">Klaar!</button></td>
            </tr>
        </tfoot>
    </table>
</form>

Er zit wel een maximum aan :)

Maak je niet druk, dat doet de compressor maar

Pagina: 1