Jquery implementation click text can be edited and modified to save to the database

This method can be found on the Internet, but many only click text editor and keep, but there is no complete code to write how to save to the database. Because I was just shallow, it took a long time to write the content of the modification with only a SQL statement saved to the database, here today and you share

This is the running picture
< img SRC = "border = 0 / / files.jb51.net/file_images/article/201404/201404151611542.gif? 2014315161217 ">  
This is the front page, the 03.aspx page

 
<table id="MyTable" cellspacing="1" cellpadding="3"> 
<asp:Repeater ID="reorderInFo" runat="server"> 
<ItemTemplate> 
<tr style="text-align: left;"> 
<td width="70" height="40" id="OrderName"> 
 Order name:  
</td> 
<td colspan="5" class="caname" id="OrderName1"> 
<%#Eval("OrderName")%> 
</td> 
</tr> 
<tr style="text-align: left;"> 
<td width="70" height="40" id="ID_Product"> 
 The product type : 
</td> 
<td class="caname" id="ID_Product1"> 
<%#Eval("ID_Product")%> 
</td> 
<td width="40" id="OrderState_Send"> 
 state : 
</td> 
<td class="caname" id="OrderState_Send1" ><%#Eval("OrderState_Send")%> 
</td> 
<td width="40" id="OrderQty"> 
 Perform a : 
</td> 
<td class="caname" id="OrderQty1" ><%#Eval("OrderQty")%> 
</td> 
</tr> 
<tr> 
<td width="70" height="60" id="SendAddress"> 
 Receiving information : 
</td> 
<td colspan="5" class="caname" id="SendAddress1" ><%#Eval("SendAddress")%> 
</td> 
</tr> 
<tr style="text-align: left;"> 
<td width="70" height="50" id="OrderMoney_Total"> 
 The total amount : 
</td> 
<td colspan="5" class="caname" id="OrderMoney_Total1" ><%#Eval("OrderMoney_Total")%> 
</td> 
</tr> 

</ItemTemplate> 
</asp:Repeater> 
</table> 

This is js 03. Js

 
$(function () { 
//Gets the element with class as caname
$(".caname").click(function () { 
var td = $(this); 
var txt = $.trim(td.text()); 
var input = $("<input type='text'value='" + txt + "'/>"); 
td.html(input); 
input.click(function () { return false; }); 
//Get focus
input.trigger("focus"); 
//When the text box loses focus, it submits the content and becomes text again
input.blur(function () { 
var newtxt = $(this).val(); 
//Determine if the text has been modified
if (newtxt != txt) { 
td.html(newtxt); 

//This section that does not need to use the database may not

//var Order_Id = $("#ID_Order").text(); 
var updateCol = $.trim(td.prev().attr("id"));//My main point is: td. Prev (); Represents the previous td of this td. This code means the previous td id of the td you clicked on (see the previous 03.aspx page if you don't understand).
//Ajax asynchronously changes the database with the parameter date to solve the caching problem
url = "../test/03.ashx?caname=" + newtxt + "&updateCol=" + updateCol + "&date=" + new Date(); 




//Open a generic handler using the get() method, and data accepts the parameters returned (context.response.write (" parameters to be returned ");)
//The modification of the database is done in the general handler
$.get(url, function (data) { 
// if (data == "1") { 
//Alert (" the category already exists!" );
// td.html(txt); 
// return; 
// } 
// alert(data); 
alert(" Modify the success "); 
td.html(newtxt); 
}); 

 
<p><span style="font-size:14px;"> This is the general handler page <span style="font-family:Times New Roman;"> 03.ashx</span></span></p><p> 
<%@ WebHandler Language="C#" Class="_03" %></p> 

 
<p>using System; 
using System.Web; 
using System.Data.SqlClient;</p><p>public class _03 : IHttpHandler { 

public void ProcessRequest (HttpContext context) { 
context.Response.ContentType = "text/plain"; 
int OrderId = 5;</p><p> string newOrderName = context.Request.QueryString["caname"];//Gets the user's modified text
string updateCol = context.Request.QueryString["updateCol"];//Gets the value of the last td id of this td modified by the user (this id is the same as the column name in the database)
string sql = "update eoPrintOrder set " + updateCol + " <a target="_blank" href="mailto:=@name">=@name</a> where <a target="_blank" href="mailto:Id_order=@id';//">Id_order=@id";//</a> Through this one sql Statement to modify the database  SqlParameter[] pams = { 
new SqlParameter("@name",newOrderName), 
new SqlParameter("@id",OrderId) 
}; 


string data = DscySFL.DbHelp.ExecuteCommand(sql,pams ).ToString(); 
context.Response.Write(data); 

} 

public bool IsReusable { 
get { 
return false; 
} 
}</p><p>}</p>