將divs內容保存到數據庫

Question

我正在使用Aloha Editor並且非常喜歡它。

我堅持將數據從頁面上的不同divs保存到數據庫。

我發現了一個名爲CONTENTEDITABLE教程在：http://gazpo.com/2011/09/contenteditable/

這樣可以節省1格到數據庫，但我有我的網頁上多個div，我不能工作了的邏輯。

我真的很感激，如果你可以幫忙嗎？

我有以下的PHP /的JavaScript /阿賈克斯對我的index.php：

<?php 
      //get data from database. 
       include("db.php"); 
      ?> 


<script> 
    $(document).ready(function() { 

     $("#save").click(function (e) {   
      var content = $('[class^="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'); 
        } 
       } 
      }); 

     }); 

     $('[class^="editable"]').click(function (e) { 
      $("#save").show(); 
      e.stopPropagation(); 
     }); 

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

    }); 

</script> 

在我的index.php，每個div的一個獨特的類，例如.editable1和DIV中我有下面的PHP從數據庫呼應數據：

<div class="editable1"> 
<?php 
     $sql = mysql_query("select text from content where element_id='1'"); 
     $row = mysql_fetch_array($sql);   
     echo $row['text']; 
?> 
</div> 
<div class="editable2"> 
<?php 
     $sql = mysql_query("select text from content where element_id='2'"); 
     $row = mysql_fetch_array($sql);   
     echo $row['text']; 
?> 
</div> 

我save.php我：

<?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 element_id = '1' "; 
     $sql = "UPDATE content SET text = '$content' WHERE element_id = '2' "; 


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

?> 

我db.php中：

<?php 
    //database connection 
    mysql_connect("localhost", "root", "root") or die(mysql_error()); 
    mysql_select_db("create") or die(mysql_error()); 
?> 

的問題是，當我在上面說div.editable1阿羅哈編輯器更新文本「保存成功」，但是當我刷新頁面的div是空的，數據庫中的行也是空的。

任何幫助將是非常讚賞:)

感謝， 米歇爾

Answer 1

首先，你設置你的JavaScript通過兩個div`s作爲內容1和內容2

var content1 = $('.editable1').html(); 
var content2 = $('.editable2').html(); 

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

的值然後在你的PHP端調整代碼來處理兩個輸入參數。

include("db.php"); 
    $content1 = $_POST['content1']; //get posted data 
    $content1 = mysql_real_escape_string($content1); //escape string 

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


    $sql = "UPDATE content SET text = '$content1' WHERE element_id = '1' "; 
    mysql_query($sql); 

     $sql = "UPDATE content SET text = '$content2' WHERE element_id = '2' "; 
    if (mysql_query($sql)) 
    { 
     echo 1; 
    }