javascript - Multiple fields in PHP contact form -
i'm creating form dynamically adds additional fields necessary.
how can register dynamic fields in contact forms php?
also, why remove button result in error bootstrap core jquery?
the 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> and here's 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 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\">"; } ?> the javascript:
<script type="text/javascript"> $(document).ready(function () { $('#btnadd').click(function () { var num = $('.clonedinput').length; // how many "duplicatable" input fields have var newnum = new number(num + 1); // numeric id of new input field being added // create new element via clone(), , manipulate it's id using newnum value var newelem = $('#input' + num).clone().attr('id', 'input' + newnum); // manipulate name/id values of input inside new element newelem.children(':first').attr('id', 'name' + newnum).attr('name', 'name' + newnum); // insert new element after last "duplicatable" input field $('#input' + num).after(newelem); // enable "remove" button $('#btndel').attr('disabled', ''); $('#fieldnumber').val(num + 1); // business rule: can add 5 names if (newnum == -1) $('#btnadd').attr('disabled', 'disabled'); }); $('#btndel').click(function () { var num = $('.clonedinput').length; // how many "duplicatable" input fields have $('#input' + num).remove(); // remove last element // enable "add" button $('#btnadd').attr('disabled', ''); //take 1 value of hidden field $('#fieldnumber').val(num - 1); // if 1 element remains, disable "remove" button if (num - 1 == 1) $('#btndel').attr('disabled', 'disabled'); }); $('#btndel').attr('disabled', 'disabled'); }); </script>
you'll have new fields in $_post variable , can access each of them $_post['child4'] (don't make input names digits did). may come loop so
foreach($_post $key => $value) { if (strpos($key, 'child') === 0) { // value starts book_ } } 
Comments
Post a Comment