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