Question

这是我的ajax

$(".submit").click(function(){

    var vp = $("input#vehicle_plate").val();
    var vm = $("input#vehicle_model").val();
    var vt = $("input#vehicle_type").val();
    var da = $("input#date_acquired").val();
    var ad = $("input#assigned_driver").val();
    var dataString = 'vehicle_plate='+ vp + '&vehicle_model='+ vm + '&vehicle_type='+ vt + '&date_acquired='+ da + '&assigned_driver='+ ad;

    $.ajax({
    type: "POST",
    url: "process.php",
    data: dataString,
    success: function(){
    $('.success').fadeIn(200).show();
    $('.error').fadeOut(200).hide();
    }
    });
    return false;

    });

这是我的PHP，我传递'dataString'

<?PHP
    include("db.classes.php");
    $g = new DB();
    $g->connection();
    if($_POST)
    {
    $vehiclePlate = $g->clean($_POST["vehicle_plate"],1);
    $vehicleModel = $g->clean($_POST["vehicle_model"],1);
    $vehicleType = $g->clean($_POST["vehicle_type"]);
    $assignedDriver = $g->clean($_POST["assigned_driver"],1);
    $ad = date('Y-m-d', strtotime($_POST["datepicker"])); 
            $g->add($vehiclePlate, $vehicleModel, $vehicleType, $assignedDriver, $ad);                                       
    }
        $g->close();
        ?>

这是我的数据库查询

public function add($vehiclePlate, $vehicleModel, $vehicleType, $assignedDriver, $ad)
    {
        $sql = "insert into vehicles(`vehicle_plates`,`DA`,`type`, `model`, `driver`) values('$vehiclePlate', '$ad', '$vehicleType', '$vehicleModel', '$assignedDriver')";

        if(!mysql_query($sql))
        {
            $this->error = mysql_error();
            return true;
        }

        else
        {
            return false;
        }
    }

AJax返回成功但是当我尝试在我的数据库中看到表格时，插入的行是'未定义'，这似乎是导致这种情况的？

编辑：

这是我的HTML

<div id="rform">
        <form action = "list.php" method="post">
        <fieldset>
                <legend>Fill Up the Form</legend><br>
            <div>
                <label class="label-left">*Vehicle Plate:</label>
                <input class="label-left" type="text" name="vehicle_plate" id="inputbox1" value maxlength="50">
            </div>

            <div>
                <label class="label-left">*Vehicle Type:</label>
                <select class="label-left" id="inputbox" name ="vehicle_type" onchange="document.getElementById('text_content').value=this.options[this.selectedIndex].text">
                    <option value="Motorcycle">Motorcycle</option>
                    <option value="Tricycle">Tricycle</option>
                    <option value="Pick-up">Pick-up</option>
                    <option value="Truck">Truck</option>
                </select><br><br>
            </div>

            <div>
                <label class="label-left">*Vehicle Model:</label>
                <input class="label-left" type="text" name="vehicle_model" id="inputbox" value maxlength="50">
            </div>

            <div>
                <label class="label-left">Date Acquired:</label>
                <input class="label-left" name="date_acquired" id="datepicker" value maxlength="50"><br><br>
            </div>

            <div>
                <label class="label-left">Assigned Driver:</label>
                <input class="label-left" type="text" name="assigned_driver" id="inputbox" value maxlength="50"><br><br>
            </div>

            <div>
                <label class="label-custom" color = red>NOTE: "*" Fields are required</label><br><br>
            </div>
            <span class="error" style="display:none"> Please Enter Valid Data</span>
            <span class="success" style="display:none"> Registration Successfully</span>

            <input id="button" type="submit" value="Add" name = "subBtn" class = "submit"/>

        </fieldset>
        </form>
        </div>

Answer 1

问题在于您的选择器：

var vp = $("input#vehicle_plate").val();
var vm = $("input#vehicle_model").val();
var vt = $("input#vehicle_type").val();
var da = $("input#date_acquired").val();
var ad = $("input#assigned_driver").val();

您的输入选择器没有id属性，而是您需要通过name属性选择它们（或者您可以为您的html输入元素赋予id属性，以便您的上述选择器将起作用）：

var vp = $("input[name=vehicle_plate]").val();
var vm = $("input[name=vehicle_model]").val();
var vt = $("input[name=vehicle_type]").val();
var da = $("input[name=date_acquired]").val();
var ad = $("input[name=assigned_driver]").val();

它会将您的值正确传递给服务器。

Answer 2

您将dataString连接为GET - 字符串，该字符串用于通过网址传递，但不在POST中工作 - 这样的请求。

您必须在javascript-object中传递POST数据：

data: { vehicle_plate: vp, vehicle_model: vm, vehicle_type: vt }

......等等。

Answer 3

使用serialize()它更简单，更不容易出错。

$(".submit").click(function () {

    var dataString = $("#rform form").serialize();

    $.ajax({
        type: "POST",
        url: "process.php",
        data: dataString,
        success: function () {
            $('.success').fadeIn(200).show();
            $('.error').fadeOut(200).hide();
        }
    });
    return false;

});

为什么阿贾克斯通过＆＃39;未定义＆＃39;数据到MySql？

3 个答案: