Rijen tellen uit een script en verwerken met SQL
Voor mijn systeem m.b.t. urenregistratie ben ik een variabel aantal rijen aan het creëren. Nu wil ik deze rijen (in variërend aantal) dus wegschrijven in een SQL-database m.b.v. een post-form.
Om de rijen te creeëren gebruik ik de volgende code (script gevonden elders op internet):
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
36
37
38
39
40
41
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
<form method="post">
<table id="myTable">
<tr>
<td><input type="text" name="links"></td>
<td><input type="text" name="keywords"></td>
<td><input type="text" name="violationtype"></td>
</tr>
</table>
<input type="button" class="button" value="Add another line" onclick="addField();">
<script>
function addField (argument) {
var myTable = document.getElementById("myTable");
var currentIndex = myTable.rows.length;
var currentRow = myTable.insertRow(-1);
var linksBox = document.createElement("input");
linksBox.setAttribute("name", "links" + currentIndex);
var keywordsBox = document.createElement("input");
keywordsBox.setAttribute("name", "keywords" + currentIndex);
var violationsBox = document.createElement("input");
violationsBox.setAttribute("name", "violationtype" + currentIndex);
var addRowBox = document.createElement("input");
addRowBox.setAttribute("type", "button");
addRowBox.setAttribute("value", "Add another line");
addRowBox.setAttribute("onclick", "addField();");
addRowBox.setAttribute("class", "button");
var currentCell = currentRow.insertCell(-1);
currentCell.appendChild(linksBox);
currentCell = currentRow.insertCell(-1);
currentCell.appendChild(keywordsBox);
currentCell = currentRow.insertCell(-1);
currentCell.appendChild(violationsBox);
}
</script>
</form>
<table id="myTable">
<tr>
<td><input type="text" name="links"></td>
<td><input type="text" name="keywords"></td>
<td><input type="text" name="violationtype"></td>
</tr>
</table>
<input type="button" class="button" value="Add another line" onclick="addField();">
<script>
function addField (argument) {
var myTable = document.getElementById("myTable");
var currentIndex = myTable.rows.length;
var currentRow = myTable.insertRow(-1);
var linksBox = document.createElement("input");
linksBox.setAttribute("name", "links" + currentIndex);
var keywordsBox = document.createElement("input");
keywordsBox.setAttribute("name", "keywords" + currentIndex);
var violationsBox = document.createElement("input");
violationsBox.setAttribute("name", "violationtype" + currentIndex);
var addRowBox = document.createElement("input");
addRowBox.setAttribute("type", "button");
addRowBox.setAttribute("value", "Add another line");
addRowBox.setAttribute("onclick", "addField();");
addRowBox.setAttribute("class", "button");
var currentCell = currentRow.insertCell(-1);
currentCell.appendChild(linksBox);
currentCell = currentRow.insertCell(-1);
currentCell.appendChild(keywordsBox);
currentCell = currentRow.insertCell(-1);
currentCell.appendChild(violationsBox);
}
</script>
</form>
Zou iemand mij kunnen helpen met het maken van het PHP-stukje? alvast bedankt!
Tim
Voor mijn resultaat van de rijen toevoegen, zie http://wrbloods.000webhostapp.com/addrows.php.
Tim
Code (php)
1
2
3
4
5
2
3
4
5
<tr>
<td><input name="item[3]['name']"></td>
<td><input name="item[3]['timeIn']"></td>
<td><input name="item[3]['timeOut']"></td>
</tr>
<td><input name="item[3]['name']"></td>
<td><input name="item[3]['timeIn']"></td>
<td><input name="item[3]['timeOut']"></td>
</tr>
Dan is het na afloop een kwestie van het doorlopen van een array met foreach.
print_r() zal een goede hulp hierbij zijn.
Gewijzigd op 13/05/2018 18:42:52 door - Ariën -
Tim
Dan moet je vervolgens $_POST['item'] (heb mijn vorige post even bijgewerkt) gebruiken in je foreach, waarmee je steeds elke rij doorloopt.
Het wordt een ander verhaal als je reeds opgeslagen items wilt aanpassen (voordat je deze vergrendelt, wat mij ook wel handig lijkt als de uren gefactureerd worden / definitief worden gemaakt) - dan zet je tussen de rechte haken het id van het logboek-record zodat je weet wat er vervolgens bijgewerkt dient te worden.
Enne, "nog niet veel kaas gegeten van arrays", dan wordt dat hoog tijd als je je al met geavanceerdere zaken als databases/dynamische formulieren bezighoudt.
Ik ben bang dat ik het probleem niet helemaal goed heb uitgelegd :(
Ik ben bezig om de aanwezigheidsadministratie bij te houden. Ik voer daarom één keer de datum in, waarna ik bij iedere rij uit mijn tabel de gegevens in één keer weg wij schrijven in een SQL-tabel. Iedere rij in mijn tabel wordt dus ook een unieke rij/record in de SQL tabel, voorzien van de gebruikersnaam, datum en de aankomst/vertrektijd.
Omdat het aantal mensen niet altijd het zelfde is (soms 1, op een drukke dag 35), lijkt het mij handig om een aantal rijen toe te kunnen voegen in mijn tabel, voor iedere aanwezige 1 dus.
Nu weet ik dat ik dit kan doen met een "foreach" als ik me niet vergis, waarin ik bij iedere tabelrij een nieuwe SQL uitvoer (wanneer ik op een "save" button druk. Dit lijkt voor mij het makkelijkst.
Nu loop ik vast bij de brug van het "toevoegen van rijen" naar het creëren van een SQL voor iedere rij. Nu kan ik zoals Ariën hiervoor al aangaf een array gebruiken, maar ik snap niet helemaal wat hij bedoelt. Welke tutorial/voorbeeld kan ik hier het best voor gebruiken?
Nogmaals, hartelijk dank voor jullie reacties.
Tim
Zorg er eerst voor dat je jouw Javascript hebt aangepast zodat de browser de HTML verwerkt tot dit:
Code (php)
1
2
3
4
5
2
3
4
5
<tr>
<td><input name="item[]['name']"></td>
<td><input name="item[]['timeIn']"></td>
<td><input name="item[]['timeOut']"></td>
</tr>
<td><input name="item[]['name']"></td>
<td><input name="item[]['timeIn']"></td>
<td><input name="item[]['timeOut']"></td>
</tr>
@Thomas: Thnx! Dat werkt inderdaad makkelijker.
Zorg er dan voor dat je dit gebruikt, na de controle of je formulier ge-POST'ed is.
Vervolgens zie je een 'boom' van een gestructureerde array met daarin alles wat je verstuurd hebt. Dit heet een multi-dimensionale array.
Gewijzigd op 13/05/2018 19:42:04 door - Ariën -
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
36
37
38
39
40
41
42
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
<form method="post">
<table id="myTable">
<tr>
<td><input name="item[]['name']"></td>
<td><input name="item[]['timeIn']"></td>
<td><input name="item[]['timeOut']"></td>
</tr>
</table>
<input type="button" class="button" value="Add another line" onclick="addField();">
<script>
function addField (argument) {
var myTable = document.getElementById("myTable");
var currentIndex = myTable.rows.length;
var currentRow = myTable.insertRow(-1);
var linksBox = document.createElement("input");
linksBox.setAttribute("name", "item[]['name']");
var keywordsBox = document.createElement("input");
keywordsBox.setAttribute("name", "item[]['timeIn']");
var violationsBox = document.createElement("input");
violationsBox.setAttribute("name", "item[]['timeOut']");
var addRowBox = document.createElement("input");
addRowBox.setAttribute("type", "button");
addRowBox.setAttribute("value", "Add another line");
addRowBox.setAttribute("onclick", "addField();");
addRowBox.setAttribute("class", "button");
var currentCell = currentRow.insertCell(-1);
currentCell.appendChild(linksBox);
currentCell = currentRow.insertCell(-1);
currentCell.appendChild(keywordsBox);
currentCell = currentRow.insertCell(-1);
currentCell.appendChild(violationsBox);
}
</script>
</form>
<table id="myTable">
<tr>
<td><input name="item[]['name']"></td>
<td><input name="item[]['timeIn']"></td>
<td><input name="item[]['timeOut']"></td>
</tr>
</table>
<input type="button" class="button" value="Add another line" onclick="addField();">
<script>
function addField (argument) {
var myTable = document.getElementById("myTable");
var currentIndex = myTable.rows.length;
var currentRow = myTable.insertRow(-1);
var linksBox = document.createElement("input");
linksBox.setAttribute("name", "item[]['name']");
var keywordsBox = document.createElement("input");
keywordsBox.setAttribute("name", "item[]['timeIn']");
var violationsBox = document.createElement("input");
violationsBox.setAttribute("name", "item[]['timeOut']");
var addRowBox = document.createElement("input");
addRowBox.setAttribute("type", "button");
addRowBox.setAttribute("value", "Add another line");
addRowBox.setAttribute("onclick", "addField();");
addRowBox.setAttribute("class", "button");
var currentCell = currentRow.insertCell(-1);
currentCell.appendChild(linksBox);
currentCell = currentRow.insertCell(-1);
currentCell.appendChild(keywordsBox);
currentCell = currentRow.insertCell(-1);
currentCell.appendChild(violationsBox);
}
</script>
</form>
Voor het resultaat hiervan, zie http://wrbloods.000webhostapp.com/addrows.php
Hoe ga ik nu verder?
@Arien, hartstikke bedankt voor het stap-voor-stap begeleiden!
Tim
Gewijzigd op 13/05/2018 20:01:08 door Tim Klein
Zorg er eerst maar voor dat je het formulier kan versturen via POST met en submit-knop.
Gewijzigd op 13/05/2018 20:57:17 door - Ariën -
4,5 jaar geleden wilde je ook iets op de server zetten. Is het toen gelukt?
https://www.phphulp.nl/php/forum/topic/registratie-werkt-niet/93413/#669451
Het invoeren, welke waarden wil jij vastleggen, wie geef je toegang. Welke controles wil je gebruiken om de invoer te controleren. Zit er een login voor. Kunnen, mogen gebruikers gegevens dubbel invullen? Daar moet je over nadenken
.
Het verwerken, opslag, hier worden de data naar de database geschreven. Hier worden de gegevens uit het invoerscherm in de database gezet.
Het raadplegen kan door een kalender of week te kiezen, en dan vervolgens een selectie uit de database te presenteren, uiteraard oplopend.
Je moet dus eerst nadenken, wat heb ik straks nodig. En of er nu 40 of 100 medewerkers iets ingevoerd hebben, dat maakt voor de database niet uit. Die slaat dat keurig op. Maak eens een stroomschema, wat jij per fase wilt doen, wat aan invoer, wat aan uitvoer.
Succes
Ik heb de volgende code:
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
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
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
<form method="post">
<input type="submit" name="Submit">
<table id="myTable">
<tr>
<td><input name="name[]"></td>
<td><input name="timeIn[]" class="time"></td>
<td><input name="timeOut[]" class="time"></td>
</tr>
</table>
<input type="button" class="button" value="Add another line" onclick="addField();">
<script>
function addField (argument) {
var myTable = document.getElementById("myTable");
var currentIndex = myTable.rows.length;
var currentRow = myTable.insertRow(-1);
var linksBox = document.createElement("input");
linksBox.setAttribute("name", "name[]");
var keywordsBox = document.createElement("input");
keywordsBox.setAttribute("name", "timeIn[]",);
keywordsBox.setAttribute("class", "time",);
var violationsBox = document.createElement("input");
violationsBox.setAttribute("name", "timeOut[]");
violationsBox.setAttribute("class", "time");
var addRowBox = document.createElement("input");
addRowBox.setAttribute("type", "button");
addRowBox.setAttribute("value", "Add another line");
addRowBox.setAttribute("onclick", "addField();");
addRowBox.setAttribute("class", "button");
var currentCell = currentRow.insertCell(-1);
currentCell.appendChild(linksBox);
currentCell = currentRow.insertCell(-1);
currentCell.appendChild(keywordsBox);
currentCell = currentRow.insertCell(-1);
currentCell.appendChild(violationsBox);
var time = document.getElementsByClassName('time'); //Get all elements with class "time"
for (var i = 0; i < time.length; i++) { //Loop trough elements
time[i].addEventListener('keyup', function (e) {; //Add event listener to every element
var reg = /[0-9]/;
if (this.value.length == 2 && reg.test(this.value)) this.value = this.value + ":"; //Add colon if string length > 2 and string is a number
if (this.value.length > 5) this.value = this.value.substr(0, this.value.length - 1); //Delete the last digit if string length > 5
});
};
}
</script>
<?php
if(isset($_POST['Submit'])){
$name = $_POST['name'];
$timeIn = $_POST['timeIn'];
$timeOut = $_POST['timeOut'];
foreach( $name as $key => $n ) {
if(!empty($name[$key]) && !empty($timeIn[$key]) && !empty($timeOut[$key])){
mysqli_query($con, "INSERT INTO `AddRows`(`Name`, `timeIn`, `timeOut`) VALUES ('$name[$key]','$timeIn[$key]','$timeOut[$key]')");
}
}
}
?>
</form>
<input type="submit" name="Submit">
<table id="myTable">
<tr>
<td><input name="name[]"></td>
<td><input name="timeIn[]" class="time"></td>
<td><input name="timeOut[]" class="time"></td>
</tr>
</table>
<input type="button" class="button" value="Add another line" onclick="addField();">
<script>
function addField (argument) {
var myTable = document.getElementById("myTable");
var currentIndex = myTable.rows.length;
var currentRow = myTable.insertRow(-1);
var linksBox = document.createElement("input");
linksBox.setAttribute("name", "name[]");
var keywordsBox = document.createElement("input");
keywordsBox.setAttribute("name", "timeIn[]",);
keywordsBox.setAttribute("class", "time",);
var violationsBox = document.createElement("input");
violationsBox.setAttribute("name", "timeOut[]");
violationsBox.setAttribute("class", "time");
var addRowBox = document.createElement("input");
addRowBox.setAttribute("type", "button");
addRowBox.setAttribute("value", "Add another line");
addRowBox.setAttribute("onclick", "addField();");
addRowBox.setAttribute("class", "button");
var currentCell = currentRow.insertCell(-1);
currentCell.appendChild(linksBox);
currentCell = currentRow.insertCell(-1);
currentCell.appendChild(keywordsBox);
currentCell = currentRow.insertCell(-1);
currentCell.appendChild(violationsBox);
var time = document.getElementsByClassName('time'); //Get all elements with class "time"
for (var i = 0; i < time.length; i++) { //Loop trough elements
time[i].addEventListener('keyup', function (e) {; //Add event listener to every element
var reg = /[0-9]/;
if (this.value.length == 2 && reg.test(this.value)) this.value = this.value + ":"; //Add colon if string length > 2 and string is a number
if (this.value.length > 5) this.value = this.value.substr(0, this.value.length - 1); //Delete the last digit if string length > 5
});
};
}
</script>
<?php
if(isset($_POST['Submit'])){
$name = $_POST['name'];
$timeIn = $_POST['timeIn'];
$timeOut = $_POST['timeOut'];
foreach( $name as $key => $n ) {
if(!empty($name[$key]) && !empty($timeIn[$key]) && !empty($timeOut[$key])){
mysqli_query($con, "INSERT INTO `AddRows`(`Name`, `timeIn`, `timeOut`) VALUES ('$name[$key]','$timeIn[$key]','$timeOut[$key]')");
}
}
}
?>
</form>
Hiermee schrijf ik he succesvol naar de database! Ik weet niet of dit de netste oplossing is, maar het werkt :)
Groetjes
Tim