php - 更新没有HTML form标签的数据库表并从MySQL表中获取特定值并显示

Question

我目前有一个包含 2 列的数据库表:照片编号和投票计数。 当在 html 页面上按下相应的照片时，我想增加数据库中的投票计数。另外，我不想转到另一个页面，因为按下照片时会有叠加内容。 (因此表单标签中没有任何操作。

HTML

<form action="" method="post">
        <input id="box1" type="submit">
        <input id="result1" name="result1" type="text" value="0"/>
</form>

PHP

<?php
$link = mysqli_connect("localhost", "root", "", "votingcount");

// Check connection
if($link === false){
die("ERROR: Could not connect. " . mysqli_connect_error());
}

 $sql = "UPDATE vote_result SET vote_count = vote_count + 1 WHERE photo_no=1";
if(mysqli_query($link, $sql)){
echo "Records added successfully.";
} else{
echo "ERROR: Could not able to execute $sql. " . mysqli_error($link);
}

// close connection
mysqli_close($link);
?>

运行 php

$(function() {
        $('form').bind('submit', function(){
            $.ajax({
                type: 'post',
                url: "insert.php",
                data: $("form").serialize(),
                success: function() {
                }
            });
            return false;
        });
    });

我所做的是只允许在数据库中更新第一张照片计数。但是我还有其他 7 张照片，我也想在点击相应照片时更新相应的投票数。

Answer 1

这是否符合您的需求？

var votes = [0, 0, 0];
$(document).ready(function() {
  $('.photoButton').click(function() {
    // Here, make you ajax call using photo_id
    ++votes[$(this).parent().attr('photo_id')];
    $(this).prev().text(votes[$(this).parent().attr('photo_id')]);
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="#photo-gallery">
  <div class="photo" photo_id="0">
    <img src="http://lmsotfy.com/so.png" style="width:100px" />
    <span class="vote">0</span> <span class="photoButton">+</span>
  </div>
  <div class="photo" photo_id="1">
    <img src="http://zelcs.com/wp-content/uploads/2013/02/stackoverflow-logo-dumpster.jpg" style="width:100px" />
    <span class="vote">0</span> <span class="photoButton">+</span>
  </div>
  <div class="photo" photo_id="2">
    <img src="https://www.stackoverflowbusiness.com/hubfs/logo-so-color.png?t=1484933198957" style="width:100px" />
    <span class="vote">0</span> <span class="photoButton">+</span>
  </div>
</div>

使用 ajax(这是想法，没有经过正确测试):

$(function() {
    $('.photoButton').click(function(){
        $.ajax({
            type: 'post',
            url: "insert.php",
            data: {
                'photo_id' : $(this).parent().attr('photo_id')
            },
            success: function(data) {
                $(this).prev().text(data['vote']);
            }
        });
        return false;
    });
});

和PHP:

try {
    $sql->prepare("UPDATE vote_result SET vote_count = vote_count + 1 WHERE photo_no=:photo_id")
    ->bind('photo_id', $_GET['photo_id'])
    ->execute();
    echo json_encode(array('vote' => $sql->query('SELECT vote_count FROM vote_result WHERE photo_no=:photo_id')->bind('photo_id', $_GET['photo_id'])->fetch()->vote_count));
} catch(SqlException $e){
    // Deal with SQL errors or wrong IDs or ...
    // depending on how your sql wrapper works
}

正如我所说，这是极简主义的，只是让它正常工作的想法。

编辑:您不应该直接使用 mysqli_* 函数，更喜欢使用 PDO 或任何其他 SQL 包装器并使用准备和/或绑定(bind)查询来防止您的代码形式 SQL injection