[jQuery] How do I hook up the "Editable" plug-in to a MySQL DB?
<html xmlns:o="urn:schemas-microsoft-com:office:office" xmlns:w="urn:schemas-microsoft-com:office:word" xmlns:st1="urn:schemas-microsoft-com:office:smarttags" xmlns="http://www.w3.org/TR/REC-html40">
<head>
<meta http-equiv=Content-Type content="text/html; charset=us-ascii">
<meta name=Generator content="Microsoft Word 11 (filtered medium)">
<o:SmartTagType namespaceuri="urn:schemas-microsoft-com:office:smarttags"
name="PersonName"/>
<!--[if !mso]>
<style>
st1\:*{behavior:url(#default#ieooui) }
</style>
<![endif]-->
<style>
<!--
/* Style Definitions */
p.MsoNormal, li.MsoNormal, div.MsoNormal
{margin:0in;
margin-bottom:.0001pt;
font-size:12.0pt;
font-family:"Times New Roman";}
a:link, span.MsoHyperlink
{color:blue;
text-decoration:underline;}
a:visited, span.MsoHyperlinkFollowed
{color:purple;
text-decoration:underline;}
p.MsoPlainText, li.MsoPlainText, div.MsoPlainText
{margin:0in;
margin-bottom:.0001pt;
font-size:10.0pt;
font-family:"Courier New";}
@page Section1
{size:8.5in 11.0in;
margin:1.0in 77.95pt 1.0in 77.95pt;}
div.Section1
{page:Section1;}
-->
</style>
</head>
<body lang=EN-US link=blue vlink=purple>
<div class=Section1>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'>Hey Rick:<o:p></o:p></span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'><o:p> </o:p></span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'>See if this makes sense to you… I just made a CF page from Mika’s
Editable example.<o:p></o:p></span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'><o:p> </o:p></span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'>Hth…<o:p></o:p></span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'><o:p> </o:p></span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'>Michael<o:p></o:p></span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'><o:p> </o:p></span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'><o:p> </o:p></span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'>---------<o:p></o:p></span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'>On your Form Page:<o:p></o:p></span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'><o:p> </o:p></span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'>The jQuery:<o:p></o:p></span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'>$(document).ready(function() {<o:p></o:p></span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'> $(".theclass").editable("http://www.example.com/save.cfm",
{<o:p></o:p></span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'> type
: 'textarea',<o:p></o:p></span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'> submit : 'OK'<o:p></o:p></span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'> });<o:p></o:p></span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'>});<o:p></o:p></span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'><o:p> </o:p></span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'>The html:<o:p></o:p></span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'><p class="theclass" id="home#get_houses.unique_id#>#get_houses.address# <o:p></o:p></span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'><o:p> </o:p></span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'><o:p> </o:p></span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'><o:p> </o:p></span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'>---------<o:p></o:p></span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'>On your save.cfm:<o:p></o:p></span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'><o:p> </o:p></span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'><cfset type = left(FORM.id,2)> <o:p></o:p></span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'><cfset unique_id = removeChars(FORM.id,1,2)><o:p></o:p></span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'><cfset value = trim(FORM.value)><o:p></o:p></span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'><o:p> </o:p></span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'><cfquery datasource="my_database"><o:p></o:p></span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'> UPDATE homes_table<o:p></o:p></span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'> SET homes_table.address
= <cfqueryparam cfsqltype="CF_SQL_VARCHAR" value="#value#"><o:p></o:p></span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'> WHERE homes_table.unique_id
= <cfqueryparam cfsqltype="CF_SQL_INTEGER" value="#unique_id#"><o:p></o:p></span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'> </cfquery><o:p></o:p></span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'></cfif><o:p></o:p></span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'><o:p> </o:p></span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'><o:p> </o:p></span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'><o:p> </o:p></span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'><o:p> </o:p></span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'><o:p> </o:p></span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'>> -----Original Message-----</span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'>> From: discuss-bounces@jquery.com
[mailto:discuss-bounces@jquery.com] On</span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'>> Behalf Of Mika Tuupola</span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'>> Sent: Friday, March 09, 2007 12:55 AM</span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'>> To: <st1:PersonName w:st="on">jQuery Discussion.</st1:PersonName></span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'>> Subject: Re: [jQuery] How do I hook up the "Editable"
plug-in to a MySQL</span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'>> DB?</span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'>> </span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'>> </span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'>> On 9 Mar 2007, at 02:44, Rick Faircloth wrote:</span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'>> </span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'>> > I don’t see how to hook the “Editable”
plug-in to *any* datasource</span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'>> > right now.</span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'>> ></span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'>> You mean you want to save the text you edit to the database? For</span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'>> jEditable first and only mandatory parameter is the URL where
edited</span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'>> content is POST:ed to. For example:</span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'>> </span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'>> $(document).ready(function() {</span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'>> $(".editable").editable("http://www.example.com/save.php",
{</span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'>> type
: 'textarea',</span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'>> submit : 'OK'</span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'>> });</span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'>> });</span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'>> </span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'>> With whis example when you edit stuff and click ok stuff gets
POST:ed</span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'>> to http://www.example.com/save.php. This script should then save</span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'>> content to database. You can check examples at:</span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'>> </span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'>> http://www.appelsiini.net/~tuupola/javascript/jEditable/</span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'>> </span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'>> or browse example source code at:</span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'>> </span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'>> http://svn.appelsiini.net/viewvc/jQuery_jEditable/trunk/examples/</span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'>> </span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'>> JavaScript itself does not connect to database. You need to use
some</span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'>> serverside language such as PHP, Ruby or Perl for that.</span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'>> </span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'>> </span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'>> --</span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'>> Mika
Tuupola
http://www.appelsiini.net/~tuupola/</span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'>> </span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'>> </span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'>> </span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'>> </span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'>> _______________________________________________</span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'>> jQuery mailing list</span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'>> discuss@jquery.com</span></font>
<p class=MsoPlainText><font size=2 face="Courier New"><span style='font-size:
10.0pt'>> http://jquery.com/discuss/</span></font>
</div>
</body>
</html>
_______________________________________________
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/