视频1 视频21 视频41 视频61 视频文章1 视频文章21 视频文章41 视频文章61 推荐1 推荐3 推荐5 推荐7 推荐9 推荐11 推荐13 推荐15 推荐17 推荐19 推荐21 推荐23 推荐25 推荐27 推荐29 推荐31 推荐33 推荐35 推荐37 推荐39 推荐41 推荐43 推荐45 推荐47 推荐49 关键词1 关键词101 关键词201 关键词301 关键词401 关键词501 关键词601 关键词701 关键词801 关键词901 关键词1001 关键词1101 关键词1201 关键词1301 关键词1401 关键词1501 关键词1601 关键词1701 关键词1801 关键词1901 视频扩展1 视频扩展6 视频扩展11 视频扩展16 文章1 文章201 文章401 文章601 文章801 文章1001 资讯1 资讯501 资讯1001 资讯1501 标签1 标签501 标签1001 关键词1 关键词501 关键词1001 关键词1501 专题2001
jquery实现点击文字可编辑并修改保存至数据库_jquery
2020-11-27 21:21:57 责编:小采
文档


这个方法网上可以查到很多,但是好多只有点击文字编辑并保持,但是没有完整的代码写怎么保存到数据库。因为本人才疏学浅,费啦好长时间才写好把修改的内容只用一条sql语句保存到数据库,今天在这里和大家分享

这是运行图片

这是前台页面 03.aspx页面
代码如下:


























订单名称:

<%#Eval("OrderName")%>

产品类型:

<%#Eval("ID_Product")%>

状态:
<%#Eval("OrderState_Send")%>

印量:
<%#Eval("OrderQty")%>

收货信息:
<%#Eval("SendAddress")%>

总金额:
<%#Eval("OrderMoney_Total")%>


这是js 03.js
代码如下:
$(function () {
//获取class为caname的元素
$(".caname").click(function () {
var td = $(this);
var txt = $.trim(td.text());
var input = $("");
td.html(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()方法打开一个一般处理程序,data接受返回的参数(在一般处理程序中返回参数的方法 context.Response.Write("要返回的参数");)
//数据库的修改就在一般处理程序中完成
$.get(url, function (data) {
// if (data == "1") {
// alert("该类别已存在!");
// td.html(txt);
// return;
// }
// alert(data);
alert("修改成功");
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的上一个td的id的值(这个id与数据库中的列名相同)
string sql = "update eoPrintOrder set " + updateCol + " =@name where Id_order=@id";//通过这一条sql语句,就可以对数据库进行修改 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;
}
}

}


下载本文
显示全文
专题