使用 ajax 和 php 将表单数据发布到 mysql 数据库答案

【问题标题】：Posting form data to mysql database with ajax and php使用 ajax 和 php 将表单数据发布到 mysql 数据库
【发布时间】：2015-07-22 07:51:28
【问题描述】：

我的 index.php：

<html>
<head>
</head>
<body>

<form name="form1" action="submit.php" method='POST'>
<select id="dropdown1" name="country" onchange="window.getStates()">
<option> Select Country</option>
<option value="1">Pakistan</option>
<option value="2">India</option>
<option value="3">USA</option>
<option value="4">UK</option>
</select>
<input type="text" id="area" style="display: none;" size="16" placeholder=" Enter value"></input>
<input type="submit" id="submit" style="display: none" name="submit" value="submit" onclick="submit()">
</form>
<script type="text/javascript">
function show() {
{ document.getElementById('area').style.display = 'inline-block';
  document.getElementById('submit').style.display = 'inline-block';}
}
function getStates()
{
var xmlhttp;
try{
    xmlhttp = new XMLHttpRequest;
}catch(e)
{
    xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
if (xmlhttp)
{
    var form = document['form1'];
    var country = form['country'].value;

    xmlhttp.open("GET","http://localhost/getStates.php?country="+country,true);
    xmlhttp.onreadystatechange = function()
    {
        if(this.readyState == 4)
        {
            var s = document.createElement("select");
            s.onchange=show;
            s.id="dropdown2";
            s.name="state";
            s.innerHTML = this.responseText;

            if(form['state'])
            {
                form.replaceChild(s, form['state']);
            }
            else
                form.insertBefore(s,form['submit']);
        }
    }
    xmlhttp.send(null);
}
}

function submit() {
    var table = document.getElementById("dropdown1").value;
    var parameter = document.getElementById("dropdown2").value;
    var value = document.getElementById("area").value;
    $.ajaxSetup({
           url: "http://localhost/database.php",
         type: "POST",
    });
     $.ajax({
        data: 'table='+table+'&parameter='+parameter+'&value='+value+,       
        success: function (msg) {
        alert (msg);},
        error: function (XMLHttpRequest, textStatus, errorThrown)
        {   
        alert('Error submitting request.'); 
        }

        }); 
}
</script>
</body>
</html>

我的 getStates.php 代码：

<?php

$states=array(
"1" => array("NWFP","Sindh","Bala","Punjab","Select"),
"2" => array("gujrat","goa","U.P.","Select"),
"3" => array("bgjs","hhtrs","Bhtrshts","Utah","Select"),
"4" => array("England","Scotland","Bahwgla","Punthwthjab","Select")
);

if(isset($_GET['country']))
{
$c = $_GET['country'];
if(isset($states[$c]))
{
    for($i = count($states[$c]) -1; $i>=0; $i--)
    {
        echo "<option value='".$states[$c][$i]."'>".$states[$c][$i]."</option>";
    }
}
}

?>

database.php 代码：

<?php
header('Content-type: text/html; charset=ISO-8859-1');
try
{
if(isset($_POST['table']) && isset($_POST['parameter']) && isset($_POST['value'])){
$table = ($_POST['table']);
$parameter = ($_POST['parameter']);
$value = ($_POST['value']);
$db = mysql_connect(localhost, root, "");
$select = mysql_select_db(records, $db);
$query="INSERT INTO $_POST['table'] (Parameter,Value)
       VALUES ('".$_POST['parameter']."','".$_POST['value']."');";
}
mysql_query($query,$connection);}
catch(Exception $e)
{
echo 'Erreur : '.$e->getMessage().'<br />';
echo 'N° : '.$e->getCode();
}
?>

另外，提交按钮有一个 onclick() 和一个动作标签。单击提交按钮时，我希望执行 submit() 函数，那么我该怎么做呢？当我按下提交时，参数和值没有被输入到我的数据库中，称为记录，有 4 个表名为 1、2、3 和 4。谢谢！

我认为这行有一些问题：

$query="INSERT INTO $_POST['table'] (Parameter,Value)
       VALUES ('".$_POST['parameter']."','".$_POST['value']."');";

【问题讨论】：

危险：您使用的是an obsolete database API，应该使用modern replacement。您容易受到SQL injection attacks的影响，现代 API 可以让您更轻松地从 defend 中获得。
没关系。它唯一的本地。
不行。你在教自己坏习惯。您假设本地代码永远不会变成面向公众的代码（经常是错误的假设）。您正在寻求帮助调试使用人们不再使用的功能的代码。您正在使用比现代版本更难调试的函数。

标签： javascript php jquery mysql ajax

【解决方案1】：

您已将 submit() 注释掉，也许这就是问题所在......

表单提交超过了 onclick 调用。

您应该检查一下： http://www.codediesel.com/javascript/prevent-form-submissions-with-javascript-disabled/

<script>
$(function(){
  $("form").submit(function(e) {       
    e.preventDefault();
  });
});
</script>

【讨论】：

抱歉。我忘了编辑它。现在检查。它仍然无法正常工作