1

私の知識をアップグレードするためにあなたに質問があります。

インライン編集ページを作成しようとしています。データはデータベースに保存されています。テーブル「コンテンツ」では、テスト目的で「id」フィールドと「テキスト」フィールドの 2 つのフィールドを作成します。

「id=25」または id=X でフィールドを変更したい場合、手動で行う方法を知っています。MySQL クエリで「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;
}

これはばかげた質問かもしれませんが、私は初心者です。

助けてくれてありがとう。

更新: ルイスに感謝して古い問題を修正しましたが、最初のエントリの [保存] ボタンだけが正常に機能している間にすべてのコードを配置すると、理由がわかりません。残りはそうではありません。現時点では、「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 をテーブルのすべての投稿に挿入する方法として使用するリスクを防ぎます。

少なくとも、アドバイス: mysql_query の代わりに mysqli_query (i に注意) を使用してください。この最後のものは非推奨です。また、より多くの違いがある場合は、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 に答える