Aus dynamisch erzeugter Tabelle Werte per Post übergeben / (Werte kommen nicht an)

Status
Dieses Thema wurde gelöst! Zur Lösung gehen…

andwes

Grünschnabel
Hallo zusammen,

ich habe hier ein Problem bei dem ich mich wahrscheinlich einfach zu dumm anstelle und mit dem ich mich nun schon ein paar Tage beschäftige.
Mit Google komme ich nicht weiter, daher meine Frage an Euch in der Hoffnung Ihr könnt mir helfen:

Ich habe per JScript eine Tabelle /ein Formular dynamisch erzeugt dass sich per Knopfdruck um weitere Zeilen erweitern lässt und jeweils Input-Felder enthält.

Nun sollte günstigerweise der User darin seine Eingaben betätigen und anschließend auf Senden klicken so dass die Daten per POST übergeben werden.

Und hier kommt mein Problem, denn ich erhalte hier immer nur die Daten aus der Ursprungs (initialen) Tabelle - sprich, der ersten Zeile.
Die dynamisch hinzugefügten Zeilen gehen "verloren".

Meine Frage: Was muss ich tun, bzw. was mache ich falsch?

Hier mein Code:

------

HTML:
><div class="funktionsleiste-editmode">
<table style="border: 0px; padding-top:3px; padding-left: 25px;" >
<tr>
<td><button class="button_titel" onClick="abbrechen()">ABBRECHEN</button>
<form id="produkt" name="form" action="test_dynform2.php" method="POST">
<td style="padding-left: 10px;"><input type="submit" name="absenden" id="absenden" class="button_titel" value="SPEICHERN"></td>
</tr>
</table>
</div>

<div class="arbeitsbereich-editmode-breit" style="width: 1800px;">

<script type="text/javascript">

function clone_this()
{
  NewRow = document.getElementById('position').lastChild.cloneNode(true);
  document.getElementById('position').appendChild (NewRow);

  var i = document.getElementById('position').childNodes.length;

  var newname = new Array('position'+i+'', 'anzahl'+i+' ', 'netto'+i+' ', 'zwischensumme'+i+' ', 'mwst'+i+' ', 'brutto'+i+' ');

  for(j=0;j<document.getElementById('position').lastChild.getElementsByTagName('input').length;j++)
  {
    document.getElementById('position').lastChild.getElementsByTagName('input')[j].setAttribute('name', newname[j]) ;
    var name = document.getElementById('position').lastChild.getElementsByTagName('input')[j].name;
    document.getElementById('position').lastChild.getElementsByTagName('input')[j].value=newname[j];
  }

}
</script>

<table id="position" class="stammdaten-content" border=0 style="width: 960px;">
<tr>
<td width='250'><input type='text' name='position' value='position'></td>
<td width='100'><input type='text' name='anzahl' value='anzahl'></td>
<td width='100'><input type='text' name='netto' value='netto'></td>
<td width='100'><input type='text' name='zwischensumme' value='zwischensumme'></td>
<td width='100'><input type='text' name='mwst' value='mwst'></td>
<td width='100'><input type='text' name='brutto' value='brutto'></td>
</tr>
</table>


<input type='button' value='weitere Position' onClick='clone_this()'>
</form>


PHP:
<?php
// **********************************************************************************************************************
// Speichern vorbereiten / durchführen
// **********************************************************************************************************************
if (isset($_POST['absenden']))  // Nur wenn das Formular ausgefüllt wurde....
{
  var_dump($_POST);
}


</div>


-----

Bei dem var_dump erhalte ich folgendes Ergebnis (Beispiel)


----


Ich bin für jede konstruktive Hilfe und Unterstützung sehr dankbar! :)[/j][/j][/j][/j][/j]
 

Anhänge

  • 1.png
    1.png
    23,6 KB · Aufrufe: 1
  • 2.png
    2.png
    31,8 KB · Aufrufe: 1
Die Namen der Felder kannst du mit [] als Array definieren.
Natürlich müssen dann die generierten Felder genau gleich heissen. Dann werden alle position[] als ein Array mit den Werter der position-Felder an PHP übermittelt
HTML:
<td width='250'><input type='text' name='position[]' value='position'></td>
 
Nope, das funktioniert bei mir nicht. Ich erhalte weiterhin das Ergebnis hier:

1673450435158.png

Das Array ist doch demnach leer, korrekt? Zumindest schaffe ich es nicht, dem Array irgendeine Information heraus zu locken...
 
Vor dem Absenden:

1673452913748.png

Nach dem Absenden folgendes Ergebnis (mit print_r)

HTML:
echo "<pre>";
print_r($_POST);
echo "</pre>";


Array
(
[absenden] => SPEICHERN
[position] => Array
(
[0] => position1
)

[anzahl] => Array
(
[0] => anzahl1
)

[netto] => Array
(
[0] => netto
)

[zwischensumme] => Array
(
[0] => zwischensumme
)

[mwst] => Array
(
[0] => mwst
)

[brutto] => Array
(
[0] => brutto
)

)
 
Das Problem hat mich auch interessiert, hier meine Lösung:

HTML:
<?php
/*
 Speichern vorbereiten / durchführen
*/

if (isset($_POST["absenden"])) {
  echo '<pre>';
  var_dump($_POST);
  exit;
}
?>

<form id="produkt" name="form" method="post">

  <div class="funktionsleiste-editmode">
    <table style="border: 0px; padding-top:3px; padding-left: 25px;">
      <tr>
        <td><button class="button_titel" onClick="abbrechen()">ABBRECHEN</button>
        <td style="padding-left: 10px;"><input type="submit" name="absenden" id="absenden" class="button_titel" value="SPEICHERN"></td>
      </tr>
    </table>
  </div>

  <div class="arbeitsbereich-editmode-breit" style="width: 1800px;">

    <table id="position" class="stammdaten-content" style="width: 960px;">
      <tr>
        <td width="250"><input type="text" name="position[]" value="position"></td>
        <td width="100"><input type="text" name="anzahl[]" value="anzahl"></td>
        <td width="100"><input type="text" name="netto[]" value="netto"></td>
        <td width="100"><input type="text" name="zwischensumme[]" value="zwischensumme"></td>
        <td width="100"><input type="text" name="mwst[]" value="mwst"></td>
        <td width="100"><input type="text" name="brutto[]" value="brutto"></td>
      </tr>
    </table>

    <button type="button" id="clone">weitere Position</button>
</form>

<script>
  document.querySelector("#clone").addEventListener("click", (e) => {
    const NewRow = document.getElementById("position").lastChild.cloneNode(true);
    document.getElementById("position").appendChild(NewRow);
    let i = document.getElementById("position").childNodes.length;
    const newname = ["position" + i, "anzahl" + i, "netto" + i, "zwischensumme" + i, "mwst" + i, "brutto" + i];
    for (var j = 0; j < document.getElementById("position").lastChild.getElementsByTagName("input").length; j++) {
      document.getElementById("position").lastChild.appendChild(document.createElement("input" [i])).setAttribute("name", newname[j] + "[]");
    }
  });
</script>
 
Status
Dieses Thema wurde gelöst! Zur Lösung gehen…
Zurück