带有可变表单位置的Ajax URL

Ajax URL with variable form location

本文关键字：Ajax URL 位置 表单      更新时间：2023-09-26

我相信这个标题会得到我的谴责。版主。但我不确定该给它起什么名字。

我有一个表单，我已经保存在它自己的php文件。我在网站的每个页面底部都包含了这个表单。这是表单文件。

这应该是最少需要的代码来显示我的问题。

<?php
error_reporting(E_ALL);
//Declare variables, strip html, and php tags and then assign value from POST
if(isset($_POST['submit'])){
  $name  = strip_tags($_POST['name']);
  $phone = strip_tags($_POST['phone']);
  $email = strip_tags($_POST['email']);
  $errors = array();
//Validate input
  //Name
  if(!empty($name)) {
     //Check to see that $name only contains valid characters
     if(!preg_match("/^[a-zA-Z'-]+$/", $name)) { $errors[] = "Names may only contain letters and spaces."; } 
  }else{
     $errors[] = "Name field must be filled out.";
  }
  //End Name
  //Phone
  if(!empty($phone)) {
  }else{
     $errors[] = "Phone field must be filled out.";
  }
  //End Phone
  //Email
  if(!empty($email)) {
     if (!filter_var($email, FILTER_VALIDATE_EMAIL)) { $errors[] = "Invalid email format."; }
  }else{
     $errors[] = "Email field must be filled out.";
  }
  //End Email       
    echo json_encode($errors);
}
 ?>
<!-- Action Form -->
<section id="sectActionForm">
<div class="row">
    <div class="col1 col-md-6">
        <img class="noPad" src="/images/banners/karateka.jpg">
    </div>
    <div id="col2" class="col-md-6 col-xs-12">
            <form id="actionForm" class="" role="form" action="index.php" method="POST">
                <h3>Get your FREE class today!</h3>
                <input id="name" class="form-control" type="text" placeholder="Name" /><br/>
                <input id="phone" class="form-control" type="text" placeholder="Phone" /><br/>
                <input id="email" class="form-control" type="text" placeholder="Email" />
                <input class="btn btn-lg btn-block" type="submit" value="Send" />
            </form>
    </div>
</div>
</section>
<script type="text/javascript">
$(document).ready(function(){
    $.ajax({
        type: "POST",
        url: "action.include.php",
        dataType: "json",
        success: function(data){
            alert(data);
        }
    })
});
</script>
<!-- END Action Form -->

我的问题是，因为这个表单可以从任何页面访问，我不知道该把什么放在AJAX url部分。

我的期望行为:我想php的错误数组传递给ajax，所以它可以显示在一个模态错误框。

不确定我是否错过了什么，但是您可以直接将文件的路径作为url。如果表单php文件名是myform。php，那么ajax url就是myform。php

Try with this…

<?php
error_reporting(E_ALL);
//Declare variables, strip html, and php tags and then assign value from POST
if(isset($_POST['submit'])){
  $name  = strip_tags($_POST['name']);
  $phone = strip_tags($_POST['phone']);
  $email = strip_tags($_POST['email']);
  $errors = array();
//Validate input
  //Name
  if(!empty($name)) {
     //Check to see that $name only contains valid characters
     if(!preg_match("/^[a-zA-Z'-]+$/", $name)) { $errors[] = "Names may only contain letters and spaces."; } 
  }else{
     $errors[] = "Name field must be filled out.";
  }
  //End Name
  //Phone
  if(!empty($phone)) {
  }else{
     $errors[] = "Phone field must be filled out.";
  }
  //End Phone
  //Email
  if(!empty($email)) {
     if (!filter_var($email, FILTER_VALIDATE_EMAIL)) { $errors[] = "Invalid email format."; }
  }else{
     $errors[] = "Email field must be filled out.";
  }
  //End Email       
    exit(json_encode($errors)); // exit so it doesn't send the form below
}
 ?>
<!-- Action Form -->
<section id="sectActionForm">
<div class="row">
    <div class="col1 col-md-6">
        <img class="noPad" src="/images/banners/karateka.jpg">
    </div>
    <div id="col2" class="col-md-6 col-xs-12">
            <form id="actionForm" class="" role="form" action="index.php" method="POST">
                <h3>Get your FREE class today!</h3>
                <input id="name" class="form-control" type="text" placeholder="Name" /><br/>
                <input id="phone" class="form-control" type="text" placeholder="Phone" /><br/>
                <input id="email" class="form-control" type="text" placeholder="Email" />
                <input class="btn btn-lg btn-block" type="submit" value="Send" />
            </form>
    </div>
</div>
</section>
<script type="text/javascript">
$("#actionForm").on('submit', function(event){
    event.preventDefault(); // so it doesnt reload the page
    $.ajax({
        type: "POST",
        url: "<?php echo $_SERVER['PHP_SELF'] ?>",
        dataType: "json",
        success: function(data){
            alert(data);
        }
    });
});
</script>
<!-- END Action Form -->

name属性在哪里?我所看到的是'id'和$_POST提交的名称和值。这段代码工作过吗?我错过了什么?

编辑:

将这行代码放在<form>: <h4 id="errors" class="error"><?php if(isset($errors) && count($errors)) echo($errors);?></h4>的正上方。添加一个名为error的类，并按你想要的方式设置它的样式。您可能希望在每个错误消息的末尾添加<br>标记。或者使用爆炸命令代替添加<br>标记和echo命令。

相关文章：