ホームページ  >  記事  >  ウェブフロントエンド  >  jqueryを使用すると、テキストをクリックして編集し、変更をdatabase_jqueryに保存できます。

jqueryを使用すると、テキストをクリックして編集し、変更をdatabase_jqueryに保存できます。

WBOY
WBOYオリジナル
2016-05-16 16:52:222081ブラウズ

この方法はインターネット上でたくさん見つかりますが、その多くはテキストをクリックするだけで編集して保存できますが、テキストをデータベースに保存する方法を記述する完全なコードはありません。私には才能も知識もほとんどないので、たった 1 つの SQL ステートメントで変更されたコンテンツを作成してデータベースに保存するのに長い時間がかかりました。

これは実行中の画像です
jqueryを使用すると、テキストをクリックして編集し、変更をdatabase_jqueryに保存できます。
これはフロント ページ 03.aspx ページです

コードをコピー コードは次のとおりです:

<テーブル ID ="MyTable" cellpacing="1" cellpadding="3">
;ItemTemplate>




<%#Eval("OrderName")%>
< /tr>

製品タイプ:


<%#Eval("ID_Product")% >


caname" id="OrderState_Send1" ><%#Eval("OrderState_Send")%>


印刷量:

<%#Eval("OrderQty")%> ;


/td>
<%#Eval("SendAddress")%>

< ;tr style="text-align: left;">
金額:

;/td>




これは js 03.js




コードをコピーします


コードは次のとおりです。


$(function () {
//caname としてクラスを取得
$(".caname").click(function () {
var td = $(this);
var txt = $ .trim(td.text());
var input = $(""); input.click(function () { return false ; }); //フォーカスを取得input.trigger("focus"); //テキスト ボックスがフォーカスを失った後、 input.blur(function () { var newtxt = $(this).val();
//テキストが変更されたかどうかを判断します
if ( newtxt != txt) {
td.html(newtxt);

//データベースの使用を必要としないこのセクションは不要です

//var Order_Id = $ ("#ID_Order").text();
var updateCol = $.trim(td.prev().attr("id"));//私が言いたいことは次のとおりです: td.prev( ); この td の前の td を示します。このコードの意味は、クリックした TD の前の TD の ID です(わからない場合は、前の 03.aspx ページを参照してください)。
//Ajax はデータベースを非同期的に変更し、パラメータ date を追加することでキャッシュの問題を解決します
url = "../test/03.ashx?caname=" newtxt "&updateCol=" updateCol "&date=" new Date();




// get() メソッドを使用して汎用ハンドラーを開き、データは返されたパラメーター (汎用ハンドラー コンテキストでパラメーターを返すメソッド) を受け取ります。 Response.Write(" 返されるパラメータ");)
//汎用ハンドラ内でデータベースの変更が完了
$.get(url, function (data) {
// if ( data == "1" ) {
//alert("このカテゴリは既に存在します!");
// td.html(txt);
// }
//alert(data);
td.html(newtxt)




コードをコピー


コードは次のとおりです:


これは一般的なハンドラー ページです 03.ashx
< %@ WebHandler Language="C#" Class="_03" %>




コードをコピーします コードは次のとおりです。

using System; >using System .Web;
using System.Data.SqlClient;

public class _03 : IHttpHandler {

public void ProcessRequest (HttpContext context) {
context. Response.ContentType = "text/plain";
int OrderId = 5;

string newOrderName = context.Request.QueryString["caname"];// ユーザーが変更したテキストを取得します
string updateCol = context.Request.QueryString["updateCol"];//ユーザーによって変更された前の td の ID の値を取得します (この ID はデータベース内の列名と同じです)
string sql = "eoPrintOrder セットの更新 " updateCol " =@name ここで、Id_order=@id";//この SQL ステートメントを通じて、データベースを変更できます SqlParameter[] pams = {
new SqlParameter("@name",newOrderName) ),
new SqlParameter("@id",OrderId)
}


文字列データ = DscySFL.DbHelp.ExecuteCommand(sql,pams).ToString(); context.Response .Write(data);

}

public bool IsReusable {
get {
return false;
}
}



声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。