使用ajax和json将注释添加到mysql中

时间:2014-05-20 09:29:41

标签: php jquery mysql ajax json

enter image description here

如图所示,我的mysql中有两个表,我希望系统在不刷新页面的情况下添加和检索注释。

我有三个涉及此功能的php页面,它们是'DB.php','comment.php'和'action.php'代码如下所示:

db.php中

<?php
    $conn = mysql_connect('localhost','Practical4','1234') or die (mysql_error);
    $db=mysql_select_db('Practical4', $conn) or die (mysql_error);
?>

comment.php

<!-- ajax script -->
<script type="text/javascript" src="jquery.min.js"></script>
<script type="text/javascript">
    $(function() {
        $(".submit_button").click(function() {
            var textcontent = $("#content").val();
            var name = $("#name").val();
            var dataString = 'content=' + textcontent + '&name=' + name;
            if (textcontent == '') {
            alert("Enter some text..");
            $("#content").focus();
        }
        else {
            $("#flash").show();
            $("#flash").fadeIn(400).html('<span class="load">Loading..</span>');
            $.ajax({
                type: "POST",
                url: "action.php",
                data: dataString,
                cache: true,
                success: function(html){
                    $("#show").after(html);
                    document.getElementById('content').value='';
                    $("#flash").hide();
                    $("#content").focus();
                }  
            });
        }
        return false;
    });
});
</script>
<div>

         <!-- retrieve hotel id from hotel table -->
<?php
include('DB.php');

$id=$_GET['id'];

$query = mysql_query("select * from hotel where name='$id'");
while($rows=mysql_fetch_array($query)){

    $name=$rows['name'];
    $price=$rows['price'];
    $duetime=$rows['dueTime'];
    $address=$rows['location'];
}
?>

  <!-- post form -->
<form method="post" name="form" action="">
<h3>Add Comment for <?php echo $name;?><h3>
<input type="text" name="name" id="name" value="<?php echo $name;?>" hidden > <br>
<textarea cols="30" rows="2" name="content" id="content" maxlength="145" >
</textarea><br />
<input type="submit" value="Post" name="submit" class="submit_button"/>

</form>
</div>
<div class="space"></div>
<div id="flash"></div>
<div id="show"></div>

action.php的

<?php
include('DB.php');
$check = mysql_query("SELECT * FROM comment order by commentID desc");
if(isset($_POST['content']))
{
$content=$_POST['content'];
$name=$_POST['name'];

mysql_query("insert into comment (content,name) values ('$content','$name')");
echo '<div class="showbox">'.$content.'</div>';
}
?>

到目前为止,代码运行良好,但我想在我的ajax脚本中使用JSON而不是使用datastring,如何改变这个?

使用mysqli改变了action.php:

<?php

$DBServer = 'localhost'; // e.g 'localhost' or '192.168.1.100'
$DBUser   = 'Practical4';
$DBPass   = '1234';
$DBName   = 'Practical4';

$conn = new mysqli($DBServer, $DBUser, $DBPass, $DBName);

// check connection
if ($conn->connect_error) {
  trigger_error('Database connection failed: '  . $conn->connect_error, E_USER_ERROR);
}

$v1="'" . $conn->real_escape_string('content') . "'";
$v2="'" . $conn->real_escape_string('name') . "'";

$sql="INSERT INTO comment (content,name) VALUES ($v1,$v2)";

if($conn->query($sql) === false) {
  trigger_error('Wrong SQL: ' . $sql . ' Error: ' . $conn->error, E_USER_ERROR);
} else {
  $last_inserted_id = $conn->insert_id;
  $affected_rows = $conn->affected_rows;
  echo '<div class="showbox">'.$v1.'</div>';
}

?>

1 个答案:

答案 0 :(得分:0)

如果您说您的代码按原样运行,但您只想使用JSON发送数据,那么您需要更改的内容如下 comment.php

<script type="text/javascript">
    $(function() {
        $(".submit_button").click(function() {
            var textcontent = $("#content").val();
            var name = $("#name").val();
            var dataString = {'content': textcontent, 'name': name}; \\ HERE
            if (textcontent == '') {
                alert("Enter some text..");
                $("#content").focus();
            }
            else
            {
                $("#flash").show();
                $("#flash").fadeIn(400).html('<span class="load">Loading..</span>');
                $.ajax({
                    type: "POST",
                    url: "action.php",
                    data: dataString,
                    dataType: 'json', \\ AND HERE
                    cache: true,
                    success: function(html){
                        $("#show").after(html);
                        document.getElementById('content').value='';
                        $("#flash").hide();
                        $("#content").focus();
                    }  
                });
            }
            return false;
        });
    });
</script>

dataString已转换为json,dataType已添加到您的ajax请求中。

另外,如果你要使用mysql_*函数,你真的需要清理你传入数据库的变量。理想情况下,您应该使用PDO或mysqli提供的预处理语句。

修改

修改您的success来电;

success: function(html) {

    console.log(textcontent + ' : ' + name + ' : ' + html);

    $("#show").after(html);
    document.getElementById('content').value='';
    $("#flash").hide();
    $("#content").focus();
}

然后作为测试评论你的所有action.php 并简单地添加;

var_dump($_POST);

检查控制台......你得到了你的期望吗?您应该在表单中看到变量。