Note that there are some explanatory texts on larger screens.

plurals
  1. POHow do I set up MySQL table for this contentEditable
    primarykey
    data
    text
    <p>I have set up the database correctly I believe because the webpage doesn't return that error, but I don't know how to create the table in the database so this code can save to the database and then retrieve it. </p> <pre><code> &lt;script&gt; $(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(); }); }); &lt;/script&gt; &lt;/head&gt; &lt;body&gt; &lt;div id="wrap"&gt; &lt;h1&gt;&lt;a href="http://gazpo.com/2011/09/contenteditable/" &gt; HTML5 Inline text editing and saving &lt;/a&gt;&lt;/h1&gt; &lt;h4&gt;The demo to edit the data with html5 &lt;i&gt;contentEditable&lt;/i&gt;, and saving the changes to database with PHP and jQuery.&lt;/h4&gt; &lt;div id="status"&gt;&lt;/div&gt; &lt;div id="content"&gt; &lt;div id="editable" contentEditable="true"&gt; &lt;?php //get data from database. include("db.php"); $sql = mysql_query("select text from content where element_id='1'"); $row = mysql_fetch_array($sql); echo $row['text']; ?&gt; &lt;/div&gt; &lt;button id="save"&gt;Save&lt;/button&gt; &lt;/div&gt; &lt;div id="footer"&gt; &lt;a href="http://gazpo.com/"&gt;Tutorial by gazpo.com&lt;/a&gt; &lt;/div&gt; &lt;/div&gt; </code></pre>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload