Mehrere Felder in PHP-Kontaktformular

Question

Ich erstelle ein Formular, das bei Bedarf dynamisch zusätzliche Felder hinzufügt.

Wie kann ich diese dynamischen Felder in meinen Kontaktformularen PHP registrieren?

Warum führt die Schaltfläche Entfernen auch zu einem Fehler mit Bootstrap-Kern jQuery?

---

Die Form:

<form action="%3C?php%20bloginfo('template_url');%20?%3E/contactengine.php" class="form-horizontal cd-form" method="post"> 
    <div class="col-md-12"> 
     <h3>Ditt navn og adresse</h3> 
    </div> 
    <div class="col-md-12 medlem-form"> 
     <div class="form-group"> 
      <label class="col-sm-12 control-label" for="inputEmail3">Fornavn*</label> 
      <div class="col-sm-12"> 
       <input class="form-control" id="Fornavn" name="Fornavn" placeholder="Fornavn" type="text"> 
      </div> 
     </div> 
     <div class="form-group"> 
      <label class="col-sm-12 control-label" for="inputPassword3">Etternavn*</label> 
      <div class="col-sm-12"> 
       <input class="form-control" id="Etternavn" name="Etternavn" placeholder="Etternavn" type="text"> 
      </div> 
     </div> 
     <div class="form-group"> 
      <label class="col-sm-12 control-label" for="inputEmail3">Fødselsdato*</label> 
      <div class="col-sm-12"> 
       <input class="form-control" id="Fodselsdato" name="Fodselsdato" placeholder="Fødselsdato" type="text"> 
      </div> 
     </div> 
     <div class="form-group"> 
      <label class="col-sm-12 control-label" for="inputPassword3">Adresse*</label> 
      <div class="col-sm-12"> 
       <input class="form-control" id="Adresse" name="Adresse" placeholder="Adresse" type="text"> 
      </div> 
     </div> 
     <div class="form-group"> 
      <label class="col-sm-12 control-label" for="inputPassword3">Post nummer*</label> 
      <div class="col-sm-12"> 
       <input class="form-control" id="Postnummer" name="Postnummer" placeholder="Post nummer" type="text"> 
      </div> 
     </div> 
     <div class="form-group"> 
      <label class="col-sm-12 control-label" for="inputPassword3">Post sted*</label> 
      <div class="col-sm-12"> 
       <input class="form-control" id="Poststed" name="Poststed" placeholder="Post sted" type="text"> 
      </div> 
     </div> 
    </div><!-- end form --> 
    <div class="col-md-12"> 
     <h3>e-post og telefon nummer</h3> 
    </div> 
    <div class="col-md-12 medlem-form"> 
     <div class="form-group"> 
      <label class="col-sm-12 control-label" for="inputEmail3">Navn foresatt</label> 
      <div class="col-sm-12"> 
       <input class="form-control" id="Navnforesatt" name="Navnforesatt" placeholder="Nanv Foresatt" type="text"> 
      </div> 
     </div> 
     <div class="form-group"> 
      <label class="col-sm-12 control-label" for="inputPassword3">E-post *</label> 
      <div class="col-sm-12"> 
       <input class="form-control" id="Epost" name="Epost" placeholder="E-Post" type="text"> 
      </div> 
     </div> 
     <div class="form-group"> 
      <label class="col-sm-12 control-label" for="inputEmail3">Mobil nummer</label> 
      <div class="col-sm-12"> 
       <input class="form-control" id="Mobilnummer" name="Mobilnummer" placeholder="Mobil nummer" type="text"> 
      </div> 
     </div> 
    </div><!-- end form --> 
    <div class="col-md-12"> 
     <h3>Velg en medlemskapstype</h3> 
    </div> 
    <div class="col-md-12 medlem-form"> 
     <div class="radio"> 
      <label class="radio-inline"><input id="inlineRadio1" name="inlineRadioOptions" type="radio" value="option1"> Støttemedlem (kr 300,-)</label> <label class="radio-inline"><input id="inlineRadio2" name="inlineRadioOptions" type="radio" value="option2"> Enkelt medlem (kr 1.500,-)</label> <label class="radio-inline"><input name="multi_note" onclick="showMe('div1', this)" type="checkbox" value="1"> Familemedlem (kr 2.500,-)</label> 
     </div><!-- third level ends here --> 
     <!-- Hidden form starts here --> 
     <div id="div1" style="display:none"> 
      <hr> 
      <div class="clonedInput" id="input1" style="margin-bottom:4px;"> 
       <div class="form-group"> 
        <label class="col-sm-12 col-xs-12 control-label" for="inputEmail3">Fornavn*</label> 
        <div class="col-sm-12"> 
         <input class="form-control" id="inputEmail3" placeholder="Email" type="text"> 
        </div> 
       </div> 
       <div class="form-group"> 
        <label class="col-sm-12 col-xs-12 control-label" for="inputPassword3">Etternavn*</label> 
        <div class="col-sm-12"> 
         <input class="form-control" id="inputPassword3" placeholder="Password" type="text"> 
        </div> 
       </div> 
       <div class="form-group"> 
        <label class="col-sm-12 col-xs-12 control-label" for="inputEmail3">Fødselsdato*</label> 
        <div class="col-sm-12"> 
         <input class="form-control" id="inputEmail3" placeholder="Email" type="text"> 
        </div> 
       </div> 
       <hr> 
      </div> 
      <div id="send-BTN"> 
       <input id="btnAdd" type="button" value="+ Legg en til"> <!--<input type="button" id="btnDel" value="remove name" />--> 
       <input id="fieldnumber" type="hidden" value="1"> 
      </div> 
     </div><!-- end Hidden form --> 
    </div><!-- end form --> 
    <div class="col-md-12 bottom-hack"> 
     <input type="submit" value="Send Message"> 
    </div> 
</form> 

und hier ist die PHP

<?php 
$EmailFrom = "nett@martin.no"; 
$EmailTo = "martin@martin.no"; 
$Subject = "Ny Medlem"; 
$Fornavn = Trim(stripslashes($_POST['Fornavn'])); 
$Etternavn = Trim(stripslashes($_POST['Etternavn'])); 
$Fodselsdato = Trim(stripslashes($_POST['Fodselsdato'])); 
$Adresse = Trim(stripslashes($_POST['Adresse'])); 
$Postnummer = Trim(stripslashes($_POST['Post nummer'])); 
$Poststed = Trim(stripslashes($_POST['Post sted'])); 
$Navnforesatt = Trim(stripslashes($_POST['Navn Foresatt'])); 
$Epost = Trim(stripslashes($_POST['E-post'])); 
$Mobilnummer = Trim(stripslashes($_POST['Mobil nummer'])); 
$Medlemskaptype = Trim(stripslashes($_POST['Medlemskapstype'])); 
$FamilieMedlemFornavn = Trim(stripslashes($_POST['Familie Medlem Fornavn'])); 
$FamilieMedlemEtternavn = Trim(stripslashes($_POST['Familie Medlem Etternavn'])); 
$FamilieMedlemFodselsdato = Trim(stripslashes($_POST['Familie Medlem Fødselsdato'])); 

// validation 
$validationOK = true; 
if (!$validationOK) { 
    print "<meta http-equiv=\"refresh\" content=\"0;URL=error.htm\">"; 
    exit; 
} 

// prepare email body text 
$Body = ""; 
$Body .= "Fornavn: "; 
$Body .= $Fornavn; 
$Body .= "\n"; 
$Body .= "Etternavn: "; 
$Body .= $Etternavn; 
$Body .= "\n"; 
$Body .= "Fodselsdato: "; 
$Body .= $Fodselsdato; 
$Body .= "\n"; 
$Body .= "Adresse: "; 
$Body .= $Adresse; 
$Body .= "\n"; 
$Body .= "Post nummer: "; 
$Body .= $Postnummer; 
$Body .= "\n"; 
$Body .= "Post sted: "; 
$Body .= $Poststed; 
$Body .= "\n"; 
$Body .= "Navn Foresatt: "; 
$Body .= $Navnforesatt; 
$Body .= "\n"; 
$Body .= "E-post: "; 
$Body .= $Epost; 
$Body .= "\n"; 
$Body .= "Mobil nummer: "; 
$Body .= $Mobilnummer; 
$Body .= "\n"; 
$Body .= "Medlemskapstype: "; 
$Body .= $Medlemskaptype; 
$Body .= "\n"; 
$Body .= "Familie Medlem Fornavn: "; 
$Body .= $FamilieMedlemFornavn; 
$Body .= "\n"; 
$Body .= "Familie Medlem Etternavn: "; 
$Body .= $FamilieMedlemEtternavn; 
$Body .= "\n"; 
$Body .= "Familie Medlem Fødselsdato: "; 
$Body .= $FamilieMedlemFodselsdato; 
$Body .= "\n"; 

// send email 
$success = mail($EmailTo, $Subject, $Body, "From: <$EmailFrom>"); 

// redirect to success page 
if ($success) { 
    print "<meta http-equiv=\"refresh\" content=\"0;URL=contactthanks.php\">"; 
} else { 
    print "<meta http-equiv=\"refresh\" content=\"0;URL=error.htm\">"; 
} 
?> 

---

Die javascript:

<script type="text/javascript"> 
    $(document).ready(function() { 
     $('#btnAdd').click(function() { 
      var num = $('.clonedInput').length; // how many "duplicatable" input fields we currently have 
      var newNum = new Number(num + 1);  // the numeric ID of the new input field being added 

      // create the new element via clone(), and manipulate it's ID using newNum value 
      var newElem = $('#input' + num).clone().attr('id', 'input' + newNum); 

      // manipulate the name/id values of the input inside the new element 
      newElem.children(':first').attr('id', 'name' + newNum).attr('name', 'name' + newNum); 

      // insert the new element after the last "duplicatable" input field 
      $('#input' + num).after(newElem); 

      // enable the "remove" button 
      $('#btnDel').attr('disabled', ''); 
      $('#fieldnumber').val(num + 1); 

      // business rule: you can only add 5 names 
      if (newNum == -1) 
       $('#btnAdd').attr('disabled', 'disabled'); 
     }); 

     $('#btnDel').click(function() { 
      var num = $('.clonedInput').length; // how many "duplicatable" input fields we currently have 
      $('#input' + num).remove();  // remove the last element 

      // enable the "add" button 
      $('#btnAdd').attr('disabled', ''); 

      //Take one from value of hidden field 
      $('#fieldnumber').val(num - 1); 

      // if only one element remains, disable the "remove" button 
      if (num - 1 == 1) 
       $('#btnDel').attr('disabled', 'disabled'); 
     }); 

     $('#btnDel').attr('disabled', 'disabled'); 
    }); 
</script> 

Answer 1

Yo Wir haben die neuen Felder in Ihrer $_POST Variable und Sie können auf jeden von ihnen mit $_POST['child4'] zugreifen (machen Sie nicht Ihre Eingangsnamensziffern nur, wie Sie taten). Sie können nun wie bei einer Schleife kommen so

foreach($_POST as $key => $value) { 
    if (strpos($key, 'child') === 0) { 
     // value starts with book_ 
    } 
} 

Answer 2

Sie es in Jquery Ajax tun können, ist die Idee, diese:

1. in jquery eine Variable 0.
2. nach jeder Zugabe initialisieren einer Textarea-Inkrementvariablen.
3. am Ende haben Sie die Anzahl der Felder nur den Textbereich durchsuchen und die Daten in die Datenbank über Ajax Requette einfügen