Question

所以，我是使用PHP的新手，但想要将用户输入的任何内容添加到数据库中。

但是，我为每个名称，角色和工资索引收到错误。它似乎没有捡起来。

HTML：

<form id="input" name="input" action="employees.php" method="post">
    <div id="boxes">
        <input type="text" name="name" placeholder="Input" class="name" required><br/>
        <input type="text" name="role" placeholder="Role" class="role" required><br/>
        <input type="number" step="any" name="wage" placeholder="Wage" class="wage" required>
        <br />
        <br />
    </div>
    <button type="submit" onsubmit="return ajaxFunction()" class="button">Submit</button>
    <button type="reset" class="button">Reset</button>            
</form>

PHP：

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

$conn = new mysqli($servername, $username, $password, $dbname);

if ($conn->connect_error) {
    die("Connection failed: " . $conn->connect_error);
} 
echo "Connected successfully<br/>";

$name2 = $_POST['name'];
$role2 = $_POST['role'];
$wage2 = $_POST['wage'];

if (mysql_query("INSERT INTO employees VALUES ('$name2', '$role2', '$wage2')"))
    echo "Successfully inserted";
else
    echo "Insertion failed";

$conn->close();

?>

我还设置了一些javascript来捕获每个字段的值并将它们发送到PHP文件。我可能做错了什么......但无论如何这里是JS：

function ajaxFunction() {
    var name = $('.name').val();
    var role = $('.role').val();
    var wage = $('.wage').val();
    var dataString = '&name1' + name + '&role1' + role + '&wage1' + wage;
    $.post('employees.php', {name1:name, role1:role, wage1:wage},    function(data){
        $('#main').html(data);
    });

    if (name == '' || role == '' || wage == '') {
        alert("Please fill in all fields.");
    } else {
        $.ajax({
            type: "POST",
            url: "employees.php",
            data: dataString,
            cache: false,
            success: function(html) {
                alert(html);
            }
        });
    }

    return false;
}

Answer 1

在您的Ajax中dataString是

var dataString = '&name1' + name + '&role1' + role + '&wage1' + wage;

但是在你的PHP中

$name2 = $_POST['name'];
$role2 = $_POST['role'];
$wage2 = $_POST['wage'];

应该是

$name2 = $_POST['name1'];
$role2 = $_POST['role1'];
$wage2 = $_POST['wage1'];

Answer 2

未定义的错误意味着找不到您的数据，这是因为您的php正在寻找“name”的POST索引，而javascript正在发送“name1”。

这里的设置存在一些问题，可以在这里大大改进。

首先，onsubmit需要移入表单标签。

<form onsubmit="return isFormValid()" id="input" name="input" action="employees.php" method="post">

其次，你实际上并不需要实际从Javascript发出ajax请求，因为提交时的返回值是说js函数的返回值是否为true，否则不提交表单。因此，我们只需要根据表单验证返回true或false。

这是更新的JS函数。

function isFormValid(){
  var name = $('.name').val(), 
      role = $('.role').val(), 
      wage = $('.wage').val(),
      data = [name, role, wage],
      isValid = true;

  data.forEach(function(el){
    if( isValid && !el.trim() ){
      alert("Please fill in all fields.");
      isValid = false;
    }
  });

  return isValid;
}

还有一些关于MySQL注入的安全问题，从如何将表单数据输入数据库而不进行转义。

快速解决方案是在点击数据库之前添加一个基本的PHP方法来转义字符串。

// add at the top of your php file
function escape($value){ 
  return mysql_real_escape_string($value); 
}

// then update your variables
$name2 = escape($_POST['name']);
$role2 = escape($_POST['role']);
$wage2 = escape($_POST['wage']);

您可以在此处阅读有关mysql注入以及如何防止它的更多信息： http://php.net/manual/en/function.mysql-real-escape-string.php

编辑---------------------------

我简化了JS并删除了您遇到的令牌问题。如果添加更多输入字段，只需添加一个新变量来存储它的值，并将该变量名称添加到数据数组中。

我还更新了JS和html中的函数名，因为它更多地与任务的目的相关。

这是一个工作示例： http://codepen.io/davidbattersby/pen/LVabQe

显然，php文件不存在，如果提交通过验证，将指向空白页面，如果无效，它将发出警报，不发送。

任何人都知道我为什么用PHP得到一个未定义的索引错误？

2 个答案: