我正在编写一个在线表单,并且遇到了一个字段的问题,在提交的电子邮件中重复了多次,并且我不确定我的代码的哪一部分允许这种情况发生。
我将包括代码以及收到的输出电子邮件的图像。
任何帮助将不胜感激。
<div class="col-lg-4">
<br><label style "width: 100%;">Date of Birth:</label>
<input type="text" style="height: 30px" id="date" name="birthday" value="01/01/1900" size="15" class="form-control" />
<script>
$(function() {
$('input[name="birthday"]').daterangepicker({
singleDatePicker: true,
showDropdowns: true,
minYear: 1900,
maxYear: parseInt(moment().format('YYYY'), 10)
});
});
</script>
</div>
<div class="col-lg-6">
<br><label>Place of Birth:</label>
<input type="text" name="place" class="form-control">
</div>
<div class="col-lg-4">
<br><label>Last Church Affiliation:</label>
</div>
<div class="col-lg-8">
<div class="radio-inline">
<br><label><input type="radio" name="Church_Affil_2" value="ELCA">ELCA Lutheran</label>
</div>
<div class="radio-inline">
<br><label><input type="radio" name="Church_Affil_2" value="Lutheran">Other Lutheran</label>
</div>
<div class="radio-inline">
<br><label><input type="radio" name="Church_Affil_2" value="Catholic">Catholic</label>
</div>
<div class="radio-inline">
<label><input type="radio" name="Church_Affil_2" value="Other">Other:</label>
</div>
<div class="radio-inline" style="padding-left: 0px;margin-left: 0px;">
<input class="form-control" name="other_text" type="text" size="14">
</div>
</div>
<div class="col-lg-3">
<br>
<label style="width: 100%;">Baptized:</label>
<div class="radio-inline form-group">
<label><input type="radio" name="Baptized_2" value="No">No</label>
</div>
<div class="checkbox-inline form-group">
<label><input type="radio" name="Baptized_2" value="Yes">Yes</label>
</div>
</div>
<div class="col-lg-4">
<br /><label style="width: 100%;">Date:(if applicable)</label>
<input class="form-control" type="text" id="date" name="baptized_date2" value="1/1/1900" size="8" />
<script>
$(function() {
$('input[name="baptized_date2"]').daterangepicker({
singleDatePicker: true,
showDropdowns: true,
minYear: 1899,
maxYear: parseInt(moment().format('YYYY'), 10)
});
});
</script>
</div>
<div class="col-lg-5">
<br><label>Congregation Name/State:</label>
<input type="text" name="baptized_church2" class="form-control" size="50">
</div>
<div class="col-lg-3">
<br>
<label style="width: 100%;">Confirmed:</label>
<div class="radio-inline form-group">
<label><input type="radio" value="">No</label>
</div>
<div class="radio-inline form-group">
<label><input type="radio" value="">Yes</label>
</div>
</div>
<div class="col-lg-4">
<br /><label style="width: 100%;">Date:(if applicable)</label>
<input class="form-control" type="text" id="date" name="confirmed_date2" value="1/1/1900" size="8" />
<script>
$(function() {
$('input[name="confirmed_date2"]').daterangepicker({
singleDatePicker: true,
showDropdowns: true,
minYear: 1899,
maxYear: parseInt(moment().format('YYYY'), 10)
});
});
</script>
</div>
<div class="col-lg-5">
<br><label>Congregation Name/State:</label>
<input type="text" name="confirmed_church2" class="form-control" size="50">
</div>
<div class="col-lg-3">
<br>
<label style="width: 100%;">Married:</label>
<div class="radio-inline form-group">
<label><input type="radio" name="Married_2" value="No">No</label>
</div>
<div class="radio-inline form-group">
<label><input type="radio" name="Married_2" value="Yes ">Yes</label>
</div>
</div>
<div class="col-lg-4">
<br /><label style="width: 100%;">Date:(if applicable)</label>
<input class="form-control" type="text" id="date" name="married_date2" value="1/1/1900" size="8" />
<script>
$(function() {
$('input[name="married_date2"]').daterangepicker({
singleDatePicker: true,
showDropdowns: true,
minYear: 1899,
maxYear: parseInt(moment().format('YYYY'), 10)
});
});
</script>
</div>
<div class="col-lg-5">
<br><label>Congregation Name/State:</label>
<input type="text" name="married_church2" class="form-control" size="50">
</div>
<div class="col-lg-4">
<br><label>Occupation:</label>
<input type="text" name="Occupation2" class="form-control">
</div>
<div class="col-lg-4">
<br><label>Work Place:</label>
<input type="text" name="work_place2" class="form-control">
</div>
<div class="col-lg-4">
<br><label>Work Phone:</label>
<input type="text" name="wphone2" class="form-control">
</div>
<div class="col-lg-4">
<br><label>Cell Phone:</label>
<input type="text" name="cphone2" class="form-control">
</div>
<div class="col-lg-4">
<br><label>Email:</label>
<input type="text" name="email2" class="form-control">
</div>
</div>
<!--First Child-->
<div id="hiddenChild1" style="display:none;">
<hr>
<style>
hr {
border-width: 5px;
border-color: rgb(128, 0, 0);
}
</style>
<h3>Child #1</h3>
<div style="display:none;">
<input type="text" name="<--CHILD 1-->" readonly />
</div>
<div class="col-lg-4">
<label>Last Name:</label>
<input type="text" name="lastname3" class="form-control">
</div>
<div class="col-lg-4">
<label> First Name:</label>
<input type="text" name="firstname3" class="form-control">
</div>
<div class="col-lg-4">
<label> Middle Name:</label>
<input type="text" name="middlename3" class="form-control">
</div>
<div class="col-lg-4">
<br><label>Preferred Name:</label>
<input type="text" name="pname3" class="form-control">
</div>
<div class="col-lg-4">
<br><label style "width: 100%;">Date of Birth:</label>
<input type="text" style="height: 30px" id="date" name="birthday" value="01/01/1900" size="15" />
<script>
$(function() {
$('input[name="birthday"]').daterangepicker({
singleDatePicker: true,
showDropdowns: true,
minYear: 1899,
maxYear: parseInt(moment().format('YYYY'), 10)
});
});
</script>
</div>
<div class="col-lg-4">
<br><label>Place of Birth:</label>
<input type="text" name="place" class="form-control">
</div>
<div class="col-lg-4">
<br>
<label style="width: 100%;"><b>Gender:</b></label>
<div class="radio-inline form-group">
<input type="radio" name="Gender_3" value="Male"><label>Male</label>
</div>
<div class="radio-inline form-group">
<input type="radio" name="Gender_3" value="Female"><label>Female</label>
</div>
</div>
<div class="col-lg-4">
<br><label style="width: 100%;"><b>Current Grade:</b></label>
<select name="Grade_3" class="form-control input-sm">
<option value="">Please select one</option>
<option value="K">K</option>
<option value="1">1st</option>
<option value="2">2nd</option>
<option value="3">3rd</option>
<option value="4">4th</option>
<option value="5">5th</option>
<option value="6">6th</option>
<option value="7">7th</option>
<option value="8">8th</option>
<option value="9">9th</option>
<option value="10">10th</option>
<option value="11">11th</option>
<option value="12">12th</option>
</select>
</div>
<div class="col-lg-4">
<br><label style="width: 100%;">Current School:</label>
<input type="text" name="school_3" class="form-control">
</div>
<div class="col-lg-3">
<br>
<label style="width: 100%;">Baptized:</label>
<div class="radio-inline form-group">
<label><input type="radio" name="Baptized_3" value="No">No</label>
</div>
<div class="radio-inline form-group">
<label><input type="radio" name="Baptized_3" value="Yes">Yes</label>
</div>
</div>
<div class="col-lg-4">
<br /><label style="width: 100%;">Date:(if applicable)</label>
<input class="form-control" type="text" id="date" name="baptized_date3" value="1/1/1900" size="8" />
<script>
$(function() {
$('input[name="baptized_date3"]').daterangepicker({
singleDatePicker: true,
showDropdowns: true,
minYear: 1899,
maxYear: parseInt(moment().format('YYYY'), 10)
});
});
</script>
</div>
<div class="col-lg-5">
<br><label>Congregation Name/State:</label>
<input type="text" name="baptized_church3" class="form-control" size="50">
</div>
<div class="col-lg-3">
<br>
<label style="width: 100%;">Communion:</label>
<div class="radio-inline form-group">
<label><input type="radio" name="Communion_3" value="No">No</label>
</div>
<div class="radio-inline form-group">
<label><input type="radio" name="Communion_3" value="Yes">Yes</label>
</div>
</div>
<div class="col-lg-4">
<br /><label style="width: 100%;">Date:(if applicable)</label>
<input class="form-control" type="text" id="date" name="communion_date3" value="1/1/1900" size="8" />
<script>
$(function() {
$('input[name="communion_date"]').daterangepicker({
singleDatePicker: true,
showDropdowns: true,
minYear: 1899,
maxYear: parseInt(moment().format('YYYY'), 10)
});
});
</script>
</div>
<div class="col-lg-5">
<br><label style="width: 100%;">Congregation Name/State:</label>
<input type="text" name="communion_church3" class="form-control" size="50">
</div>
<div class="col-lg-3">
<br>
<label style="width: 100%">Confirmation:</label>
<div class="radio-inline form-group">
<label><input type="radio" name="Confirmation_3" value="No">No</label>
</div>
<div class="radio-inline form-group">
<label><input type="radio" name="Confirmation_3" value="Yes">Yes</label>
</div>
</div>
<div class="col-lg-4">
<br /><label style="width: 100%;">Date:(if applicable)</label>
<input class="form-control" type="text" id="date" name="confirmation_date3" value="1/1/1900" size="8" />
<script>
$(function() {
$('input[name="confirmation_date"]').daterangepicker({
singleDatePicker: true,
showDropdowns: true,
minYear: 1899,
maxYear: parseInt(moment().format('YYYY'), 10)
});
});
</script>
</div>
<div class="col-lg-5">
<br><label style="width: 100%;">Congregation Name/State:</label>
<input type="text" name="confirmation_church3" class="form-control" size="50">
</div>
<div class="col-lg-5">
<br><label>Email/Cell:(if permitted)</label>
<input type="text" name="email/cell3" class="form-control">
</div>
</div>
</div>
<div class="text-right"><input class="btn btn-primary" onclick="validateRequired();" type="submit" value="Next Page" name="send"></div>
</form>
</div>
</div>
</div>
</div>
<script>
function show_adult(aval) {
if (aval == "1") {
hiddenAdult1.style.display = 'inline-block';
hiddenAdult2.style.display = 'none';
} else if (aval == "2") {
hiddenAdult1.style.display = 'inline-block';
hiddenAdult2.style.display = 'inline-block';
} else {
hiddenAdult1.style.display = 'none';
hiddenAdult2.style.display = 'none';
}
};
</script>
<script>
function show_child(bval) {
if (bval == "1") {
hiddenChild1.style.display = 'inline-block';
hiddenChild2.style.display = 'none';
hiddenChild3.style.display = 'none';
hiddenChild4.style.display = 'none';
hiddenChild5.style.display = 'none';
} else if (bval == "2") {
hiddenChild1.style.display = 'inline-block';
hiddenChild2.style.display = 'inline-block';
hiddenChild3.style.display = 'none';
hiddenChild4.style.display = 'none';
hiddenChild5.style.display = 'none';
} else if (bval == "3") {
hiddenChild1.style.display = 'inline-block';
hiddenChild2.style.display = 'inline-block';
hiddenChild3.style.display = 'inline-block';
hiddenChild4.style.display = 'none';
hiddenChild5.style.display = 'none';
} else if (bval == "4") {
hiddenChild1.style.display = 'inline-block';
hiddenChild2.style.display = 'inline-block';
hiddenChild3.style.display = 'inline-block';
hiddenChild4.style.display = 'inline-block';
hiddenChild5.style.display = 'none';
} else if (bval == "5") {
hiddenChild1.style.display = 'inline-block';
hiddenChild2.style.display = 'inline-block';
hiddenChild3.style.display = 'inline-block';
hiddenChild4.style.display = 'inline-block';
hiddenChild5.style.display = 'inline-block';
} else {
hiddenChild1.style.display = 'none';
hiddenChild2.style.display = 'none';
hiddenChild3.style.display = 'none';
hiddenChild4.style.display = 'none';
hiddenChild5.style.display = 'none';
}
};
</script>
<script>
var date = document.getElementById('date');
function checkValue(str, max) {
if (str.charAt(0) !== '0' || str == '00') {
var num = parseInt(str);
if (isNaN(num) || num <= 0 || num > max) num = 1;
str = num > parseInt(max.toString().charAt(0)) && num.toString().length == 1 ? '0' + num : num.toString();
};
return str;
};
date.addEventListener('input', function(e) {
this.type = 'text';
var input = this.value;
if (/\D\/$/.test(input)) input = input.substr(0, input.length - 3);
var values = input.split('/').map(function(v) {
return v.replace(/\D/g, '')
});
if (values[0]) values[0] = checkValue(values[0], 12);
if (values[1]) values[1] = checkValue(values[1], 31);
var output = values.map(function(v, i) {
return v.length == 2 && i < 2 ? v + ' / ' : v;
});
this.value = output.join('').substr(0, 14);
});
date.addEventListener('blur', function(e) {
this.type = 'text';
var input = this.value;
var values = input.split('/').map(function(v, i) {
return v.replace(/\D/g, '')
});
var output = '';
if (values.length == 3) {
var year = values[2].length !== 4 ? parseInt(values[2]) + 2000 : parseInt(values[2]);
var month = parseInt(values[0]) - 1;
var day = parseInt(values[1]);
var d = new Date(year, month, day);
if (!isNaN(d)) {
document.getElementById('result').innerText = d.toString();
var dates = [d.getMonth() + 1, d.getDate(), d.getFullYear()];
output = dates.map(function(v) {
v = v.toString();
return v.length == 1 ? '0' + v : v;
}).join(' / ');
};
};
this.value = output;
});
</script>