我正在创建一个表单,根据需要动态添加其他字段。
如何在我的联系表单PHP中注册这些动态字段?
另外,为什么删除按钮导致Bootstrap核心jQuery出错?
表格:
<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>
这里是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\">";
}
?>
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>
答案 0 :(得分:1)
您的$_POST
变量中有新字段,您可以使用$_POST['child4']
访问每个字段(不要像以前那样输入您的输入名称数字)。你现在可以想出一个像这样的循环
foreach($_POST as $key => $value) {
if (strpos($key, 'child') === 0) {
// value starts with book_
}
}
答案 1 :(得分:0)
你可以在jquery ajax中做到,这个想法是这样的: