现场输出重复

时间:2018-10-11 18:47:07

标签: javascript

我正在编写一个在线表单,并且遇到了一个字段的问题,在提交的电子邮件中重复了多次,并且我不确定我的代码的哪一部分允许这种情况发生。

我将包括代码以及收到的输出电子邮件的图像。

任何帮助将不胜感激。

<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>

Output Email

0 个答案:

没有答案