1

我有一个问题要你升级我的知识。

我正在尝试创建一个内联编辑页面，数据存储在数据库中。在“内容”表中，我创建了 2 个用于测试目的的字段，即“id”和“text”字段。

如果我想用“id=25”或 id=X 修改字段，我知道如何手动进行，只需在 MySQL Query 中指定“WHERE id=25”，但如果我有 1000 个条目的列表，如何修改查询以即时获取 ID？

这是代码，我正在玩：

index.php文件

<style>
body {      
    font-family: Helvetica,Arial,sans-serif;
    color:#333333;
    font-size:13px;
}

h1{
    font-family: Georgia, Times, serif;
    font-size: 28px;        
}

a{
    color: #0071D8;
    text-decoration:none;
}

a:hover{
    text-decoration:underline;
}

:focus {
    outline: 0;
}

#wrap{
    width: 500px;
    margin:0 auto;              
    overflow:auto;      
}

#content{
    background: #f7f7f7;
    border-radius: 10px;
}

#editable {     
    padding: 10px;      
}

#status{
    display:none; 
    margin-bottom:15px; 
    padding:5px 10px; 
    border-radius:5px;
}

.success{
    background: #B6D96C;
}

.error{
    background: #ffc5cf; 
}

#footer{
    margin-top:15px;
    text-align: center;
}

#save{  
    display: none;
    margin: 5px 10px 10px;      
    outline: none;
    cursor: pointer;    
    text-align: center;
    text-decoration: none;
    font: 12px/100% Arial, Helvetica, sans-serif;
    font-weight:700;    
    padding: 5px 10px;  
    -webkit-border-radius: 5px; 
    -moz-border-radius: 5px;
    border-radius: 5px; 
    color: #606060;
    border: solid 1px #b7b7b7;  
    background: #fff;
    background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#ededed));
    background: -moz-linear-gradient(top,  #fff,  #ededed);
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#ededed');
}   

#save:hover
{
    background: #ededed;
    background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#dcdcdc));
    background: -moz-linear-gradient(top,  #fff,  #dcdcdc);
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#dcdcdc');
}

</style>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js" type="text/javascript"></script>
 <script>
 $(document).ready(function() {

$("#save").click(function (e) {         
    var content = $('#editable').html();    

    $.ajax({
        url: 'save.php',
        type: 'POST',
        data: {
        content: content
        },              
        success:function (data) {

            if (data == '1')
            {
                $("#status")
                .addClass("success")
                .html("Data saved successfully")
                .fadeIn('fast')
                .delay(3000)
                .fadeOut('slow');   
            }
            else
            {
                $("#status")
                .addClass("error")
                .html("An error occured, the data could not be saved")
                .fadeIn('fast')
                .delay(3000)
                .fadeOut('slow');   
            }
        }
    });   

});

$("#editable").click(function (e) {
    $("#save").show();
    e.stopPropagation();
});

$(document).click(function() {
    $("#save").hide();  
});

 });
 </script>

</head>
<body>
<div id="wrap">

    <div id="status"></div>

    <div id="content">

    <div id="editable" contentEditable="true">
    <?php
        //get data from database.
        include("db.php");
        $sql = mysql_query("select * from content");
        $row = mysql_fetch_array($sql);     
        echo $row['id'];
        echo "<br />";
        echo $row['text'];
    ?>      
    </div>  

    <button id="save">Save</button>
    </div>

</div>
  </body>

这是save.php文件：

include("db.php");


$content = $_POST['content']; //get posted data
$content = mysql_real_escape_string($content);  //escape string 

$sql = "UPDATE content SET text = '$content' WHERE id = '$id' ";

if (mysql_query($sql))
{
    echo 1;
}

我知道这可能是一个愚蠢的问题，但我是新手。

预先感谢您的帮助。

更新： 感谢 Luis 我解决了我的老问题，但我不知道为什么如果我将所有代码放在一段时间内，只有第一个条目的“保存”按钮运行良好，其余的没有，有什么提示吗？目前我只测试“description_text”。

这是“while”代码：

<?php 

    /////////// Now let us print the table headers //////////////// 

    $query =" SELECT * FROM gallery ORDER BY id DESC ";

    $result = mysql_query($query) or die(mysql_error());

    echo "<div style='width: 100%; text-align: center;'>";                   
    echo "<table style='margin: auto auto;'>";
    echo "<tr><th>ID</th><th>Image</th><th>Category</th><th>Description</th><th>Added on</th></tr>";

    while($ordinate = mysql_fetch_array($result))
    {

    $id     = $ordinate['id'];
    $img_name    = $ordinate['img_name'];
    $category     = $ordinate['category'];
    $description_text = $ordinate['description_text'];
    $insert_datetime    = $ordinate['insert_datetime'];

    echo "<tr><td style='width: 20px;'>".$id."</td><td style='width: 210px;'><img src='../../upload/content/uploaded_images/". $img_name ."' width='200px'></td><td style='width: 100px;'>".$category."</td><td style='width: 100px;'><div id='status'></div><div id='content'><div id='editable' contentEditable='true'>".$description_text."</div><button id='save'>Save</button></div></td><td style='width: 100px;'>".$insert_datetime."</td></tr>";        

    }
    echo "</table><br /><br /></div>";
?>
4

2 回答 2

3

在 index.php 上，将这部分代码移到开头，这样您就可以在脚本的其余部分使用相同的变量。

<?php
    //get data from database.
    include("db.php");
    $sql = mysql_query("select * from content");
    $row = mysql_fetch_array($sql);     
    // echo $row['id'];    but keep this ones in its original place inside their <%php %> tags
    // echo "<br />";
    // echo $row['text'];
?>

稍后在 ajax 调用中，插入以下 PHP 行：

    data: {
    content: content
    <?php
    echo ", id: ".$row['id'];
    echo ", token: '".md5('my SALT text'.(int)$row['id'])."'";    // strongly!!! recomended, not mandatory
    ?>
    },

在 save.php 上

    $id = (int)$_POST['id'];                    // (int)  sanitizes  id
    $token = $_POST['token'];
    if(md5('my SALT text'.$id)!=$token) die();  // or whatever but do not execute update
                                                // perhaps  echo 0; die();

    // ... rest of your code ....
    $sql = "UPDATE content SET text = '$content' WHERE id = $id"

该令牌可防止有人使用您的 save.php 作为在桌面上的每个帖子上注入任何内容的方式的风险。

至少，一个建议：使用 mysqli_query（注意 i）而不是 mysql_query，因为最后一个已弃用。此外，但有更多不同，您可以使用 PDO

于 2012-10-23T18:38:03.370 回答
0

与其简单地回显 $row['id']，不如在具有特定 id 的 HTML 元素中回显它，以便可以从 jQuery 访问并发布它。

<span id="idfield"><?php echo $row['id']; ?></span>
<button id="save">Save</button>
</div>

然后，在 javascript 内部：

 $("#save").click(function (e) {         
    var content = $('#editable').html();    
    var id = $('#idfield').html();

将其用作 POST 中的参数：

    $.ajax({
      url: 'save.php',
      type: 'POST',
      data: {
       content: content,
       id: id
      },
于 2012-10-23T19:15:11.480 回答