如何获得此表单验证码的正确输出?

时间:2019-08-22 06:39:18

标签: javascript php html css

我的代码仅执行else语句...我找不到问题。 当我使用javascript验证表单属性地址时,它没有从PHP代码中进行验证并且没有使用else语句

预期结果:感谢您的订单

实际结果:技术问题

<?php
    $toEmail = "herbsoul1@gmail.com";
    $mailHeaders = "From: " . $_POST["name"] . "<". $_POST["email"] .">\r\n";
    $subject="Site Mail from Xtreme-Fatburn";
    $content="Name : ".$_POST["name"]."\n";
    $content=$content."MobileNo : ".$_POST["MobileNo"]."\n";
    $content=$content."Email : ".$_POST["email"]."\n";
    $content=$content."State : ".$_POST["State"]."\n";
    $content=$content."Address : ".$_POST["address"]."\n";
    if(mail($toEmail, $subject, $content, $mailHeaders)) {
        print "Thanks for your order.";
    } else {
        print "Some Technical Issues occured.";
    }
?>

背景代码

<div id="about1" class="container-fluid " style="width:100%;height:580px">
  <div class="row bg">
    <div class="col-md-9"></div>
    <div class="col-md-2" style="margin-top:192px;margin-left:0px;">
      <div class="row main">

        <div class="main-login main-center">
          <form class="form-horizontal" method="post">

            <div class="form-group">
              <label for="name" class="cols-sm-2 control-label dntr">Your Name</label><span id="userName-info" class="info">*</span>
              <div class="cols-sm-6">
                <div class="input-group">
                  <span class="input-group-addon"><i class="fa fa-user fa" aria-hidden="true"></i></span>
                  <input type="text" class="form-control" name="name" id="name" maxlength="30" placeholder="Enter your Name" />
                </div>
              </div>
            </div>
            <div class="form-group">
              <label for="username" class="cols-sm-2 control-label dntr">Mobile No</label><span id="userName-info" class="info">*</span>
              <div class="cols-sm-6">
                <div class="input-group">
                  <span class="input-group-addon"><i class="fa fa-mobile-phone" style="font-size:20px"></i></span>
                  <input type="text" class="form-control" name="MobileNo" id="MobileNo" onkeypress="return isNumber(event)" maxlength="10" placeholder="Enter your Mobile No" />
                </div>
              </div>
            </div>
            <div class="form-group">
              <label for="email" class="cols-sm-2 control-label dntr">Your Email ID</label><span id="userName-info" class="info"></span>
              <div class="cols-sm-6">
                <div class="input-group">
                  <span class="input-group-addon"><i class="fa fa-envelope fa" aria-hidden="true"></i></span>
                  <input type="text" class="form-control" maxlength="30" name="email" id="email" placeholder="Enter your Email ID" />
                </div>
              </div>
            </div>



            <div class="form-group">
              <label for="username" class="cols-sm-2 control-label dntr">State</label><span id="userName-info" class="info">*</span>
              <div class="cols-sm-6">
                <div class="input-group">
                  <span class="input-group-addon"><i class="fa fa-users fa" aria-hidden="true"></i></span>
                  <select class="form-control" id="sel1">
                    <option>Andaman and Nicobar Islands</option>
                    <option>Andhra Pradesh</option>
                    <option>Arunachal Prades</option>
                    <option>Assam</option>
                    <option>Bihar</option>
                    <option>Chhattisgarh</option>
                    <option>Chandigarh</option>
                    <option>Dadra and Nagar Haveli</option>
                    <option>Daman and Diu</option>
                    <option selected>Delhi</option>
                    <option>Goa</option>
                    <option>Gujarat</option>
                    <option>Haryana</option>
                    <option>Himachal Pradesh</option>
                    <option>Jammu and Kashmir</option>
                    <option>Jharkhand</option>
                    <option>Karnataka</option>
                    <option>Kerala</option>
                    <option>Lakshadweep</option>
                    <option>Madhya Pradesh</option>
                    <option>Maharashtra</option>
                    <option>Manipur</option>
                    <option>Meghalaya</option>
                    <option>Mizoram</option>
                    <option>Nagaland</option>
                    <option>Odisha</option>
                    <option>Punjab</option>
                    <option>Puducherry</option>
                    <option>Rajasthan</option>
                    <option>Sikkim</option>
                    <option>Tamil Nadu</option>
                    <option>Telangana</option>
                    <option>Tripura</option>
                    <option>Uttarakhand</option>
                    <option>Uttar Pradesh</option>
                    <option>West Bengal</option>

                  </select>
                </div>
              </div>
            </div>

            <div class="form-group">
              <label for="address" class="cols-sm-2 control-label dntr">Your Address</label><span id="userName-info" class="info">*</span>
              <div class="cols-sm-6">
                <div class="input-group">
                  <span class="input-group-addon"><i class="fa fa-user fa" aria-hidden="true"></i></span>
                  <input type="text" class="form-control" name="address" id="address" maxlength="30" placeholder="Enter your address" />
                </div>
              </div>
            </div>


            <div class="form-group" style="padding-top:10px;">
              <button type="button" class="btn btn-primary btn-lg btn-block login-button" id="Register" onClick="sendContact();">RUSH MY ORDER</button>
            </div>

          </form>
        </div>
      </div>
    </div>
    <div class="col-md-1"></div>
  </div>

</div>

javascript代码

<script src="https://code.jquery.com/jquery-2.1.1.min.js" type="text/javascript"></script>
<style>
  .info {
    font-size: .8em;
    color: #FF6600;
    letter-spacing: 1px;
    padding-left: 5px;
  }
</style>
<script>
  function sendContact() {
    var valid;
    valid = validateContact();
    if (valid) {
      var name1 = $("#name").val();
      var MobileNo1 = $("#MobileNo").val();
      var email1 = $("#email").val();
      var state1 = $("#sel1").val();
      var address1 = $("#address").val();
      jQuery.ajax({
        url: "sendemail.php",
        data: {
          name: name1,
          MobileNo: MobileNo1,
          email: email1,
          State: state1,
          address: address1
        },
        type: "POST",
        success: function(data) {
          //$('#Register').html(data);
          $("#name").val('');
          $("#MobileNo").val('');
          $("#email").val('');
          $("#address").val('');
          //$("#mail-status").html(data);
          alert(data);
        },
        error: function() {}
      });
    }
  }

  function validateContact() {
    var valid = true;
    if (!$("#name").val()) {
      valid = false;
      alert("Please Enter Your Name");
      return valid;
    }
    if ($("#email").val()) {
      if (!$("#email").val().match(/^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/)) {
        valid = false;
        alert("Invalid Email ID");
        return valid;
      }
    }
    if (!$("#MobileNo").val()) {
      valid = false;
      alert("Please Enter Your Mobile Number");
      return valid;
    }
    return valid;
  }
  $(document).ready(function() {

    $('.openPopup').on('click', function() {
      debugger;
      $(".modal-content").html('');
      var dataURL = $(this).attr('href');
      //$('.modal-body').load(dataURL,function(){
      // $('#dialog-example').modal({show:true});
      //});
      $.get(dataURL, function(data) {
        //alert(data);
        $(".modal-content").html(data).foundation("open");
      });

    });
  });

  function isNumber(evt) {
    var charCode = (evt.which) ? evt.which : event.keyCode
    if (charCode != 46 && charCode > 31 &&
      (charCode < 48 || charCode > 57))
      return false;

    return true;
  }
</script>

3 个答案:

答案 0 :(得分:0)

  • 要获取帖子数据,请更改按钮类型以提交: 输入=“ submit”

  • 在发送邮件之前还要检查帖子数据

答案 1 :(得分:0)

如果您在Windows中本地工作,则必须检查php.ini文件中的C:\ xampp \ php。查找邮件功能并进行如下更改

[mail function]
; XAMPP: Don’t remove the semi column if you want to work with an SMTP Server like Mercury
; SMTP = localhost
; smtp_port = 25

删除SMTP和smtp_port之前的分号,并将SMTP设置为您的smtp服务器,并将端口设置为您的smtp端口。您的设置应如下所示

SMTP = smtp.example.com
smtp_port = 25

如果配置正确,请检查垃圾邮件文件夹或邮件配置是否有限制。

或 使用PHPMailerAutoload.php PHPMailer,这非常容易。

答案 2 :(得分:0)

我在Windows XAMPP中尝试了您的“ HTML,Javascript和PHP”代码,并按照此link中的说明在php.ini和sendmail.ini文件中配置了详细信息之后,我可以成功发送电子邮件。