繁体   English   中英

Ajax到PHP未定义索引作为数据传递:

[英]Ajax to PHP Undefined Index Passed as data:

你好吗? 我不知道为什么我的代码中出现未定义索引错误。 我浏览了该网站上的大多数帖子,并尝试添加dataType,括号,使用serialize方法等。

<!DOCTYPE html>  <html>
<head>
  <!--Import Google Icon Font-->
  <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
  <!--Import materialize.css-->
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0-beta/css/materialize.min.css">
  <link rel="stylesheet" href="styles/styles.css" />

  <!--Let browser know website is optimized for mobile-->
  <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
</head>

<body>
<div class="container">
    <h1 class="center-align">Welcome to the Black Archives</h1>
    <p id="introparagraph">Thank you for visitng us today. We look forward to serving you. Please take the time to complete the following form. You're contact information will be stored in our system. This information will be used to keep you informed about upcoming events and exhibits. You will also receive a copy of our next newsletter. We will only use your information for museum-related purposes. Your information will not be sold or distributed to another party. For questions related to this form, please stop by the main office.</p>
    <div class="myForm">
        <div class="row">
            <form class="col s12" action="register.php" id="registerForm" method="POST">
                <div class="row">
                    <div class="input-field col s5">
                        <input placeholder="First Name" id="fname" name="fname" type="text" class="validate">
                        <label class="labelText" for="fname">First Name</label>
                    </div>
                    <div class="input-field col s2">
                        <input placeholder="Middle Initial" id="mi" name="mi" type="text" class="validate">
                        <label class="labelText" for="mi">Middle Initial</label>
                    </div>
                    <div class="input-field col s5">
                        <input placeholder="Last Name" id="lname" name="lname" type="text" class="validate">
                        <label class="labelText" for="lname">Last Name</label>
                    </div>
                </div>
                <div class="row">
                    <div class="input-field col s6">
                        <input placeholder="Address" id="address" name="address" type="text" class="validate">
                        <label class="labelText" for="address">Address</label>
                    </div>
                    <div class="input-field col s6">
                        <input placeholder="Address 2" id="address2" name="address2" type="text" class="validate">
                        <label class="labelText" for="address2">Address 2</label>
                    </div>
                </div>
                <div class="row">
                    <div class="input-field col s5">
                        <input placeholder="City" id="city" name="city" type="text" class="validate">
                        <label class="labelText" for="city">City</label>
                    </div>
                    <div class="input-field col s2">
                        <input placeholder="State" id="state" name="state" type="text" class="validate">
                        <label class="labelText" for="state">State</label>
                    </div>
                    <div class="input-field col s5">
                        <input placeholder="Postal Code" id="zipcode" name="zipocode" type="text" class="validate">
                        <label class="labelText" for="zipcode">Postal Code</label>
                    </div>
                </div>
                <div class="row">
                    <div class="input-field col s6">
                        <input placeholder="Email" id="email" name="email" type="email" class="validate">
                        <label class="labelText" for="email">Email Address</label>
                    </div>
                    <div class="input-field col s6">
                        <input placeholder="Phone" id="phone" name="phone" type="tel" class="validate">
                        <label class="labelText" for="phone">Phone</label>
                    </div>
                </div>
                <div class="row right-align">
                      <button class="btn waves-effect waves-light btn-large" type="submit" name="register" id="submitBtn">Submit<i class="material-icons right">send</i></button>
                </div>
            </form>
        </div>
    </div>
</div>

  <script src="js/scripts.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0-beta/js/materialize.min.js"></script>
<script type="text/javascript">
    $(document).ready(function () {
        $(".input-field>label").css("color", "black");

        $("#submitBtn").on('click', function () {
            var fname = $("#fname").val();
            var mi = $("#mi").val();
            var lname = $("#lname").val();
            var address = $("#address").val();
            var address2 = $("#address2").val();
            var city = $("#city").val();
            var state = $("#state").val();
            var zipcode = $("#zipcode").val();
            var email = $("#email").val();
            var phone = $("#phone").val();

            console.log(phone);

            if (fname == "") {
                $('#fname').css("backgroundColor", "#f7e7e1");
            }
            else if (lname == "") {
                $('#lname').css("backgroundColor", "#f7e7e1");
            }
            else {
                $.ajax({
                    url: 'register.php',
                    method: 'POST',
                    data: { data: $('#registerForm').serialize() },
                    success: function (response) {
                        console.log("Hello World!!!");
                    },
                    dataType: 'text'
                });
            }
        });
    });
</script>
</body>

这是下面的PHP文档。 当传递数据并通过浏览器的调试工具对其进行监视时,它将显示register:没有数据。

<?php
    $servername = "localhost";
    $username = "root";
    $password = "";
    $dbname = "museum";

    if (isset($_POST['register'])) {        
        $conn = new mysqli($servername, $username, $password, $dbname);

        if($conn->connect_error) {
            die("Connection failed: " . $conn->connect_error);
        }

        $fname = $_POST['fname'];
        $mi = $_POST['mi'];
        $lname = $_POST['lname'];
        $address = $_POST['address'];
        $address2 = $_POST['address2'];
        $city = $_POST['city'];
        $state = $_POST['state'];
        $zipcode = $_POST['zipcode'];
        $email = $_POST['email'];
        $phone = $_POST['phone'];

        $sql = "INSERT INTO guest (fname, mi, lname, address1, address2, city, state, zipcode, email, phone) VALUES ('$fname', '$mi', '$lname', '$address', '$address2', '$city', '$state', '$zipcode', '$email', '$phone')";

        if($conn->query($sql) === TRUE) {
            echo "New record created successfully";
        } else {
            echo "Error: " . $sql . "<br>" . $conn->error;
        }

        $conn->close();
    }
?>

一种更简单的方法是在表单中添加一个ID,并在输入字段中添加name =“”属性。 然后,当您要使用Ajax发布它们时,您所需要做的就是:data:$('#the-form-id')。serialize()。 无需在JS中定义所有字段。 – Magnus Eriksson 6小时前

这行得通,必须删除变量初始化,然后将name属性添加到每个输入中。 然后程序按预期工作。

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM