jQuery 当我在 FriendlyUrl 程序集中添加时,拖放不起作用
jQuery Drag and Drop doesn't work when I add in FriendlyUrl assembly
我创建了一个拖放功能,允许用户将一行从一个 GridView 拖到另一个 GridView,从而将记录从 Active 更新为 Inactive(反之亦然)。我面临的问题是,当我通过 Global.asax Application_Start 添加 FriendlyUrl RouteConfig 时,记录将不会保存。
我的 HTML 包括 Javascript:
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="default.aspx.cs" Inherits="DragAndDrop._default" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Grids</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:GridView ID="InactiveClients" runat="server" ShowHeaderWhenEmpty="true" CssClass="drag_drop_grid gridview" HeaderStyle-CssClass="gridview-header" AutoGenerateColumns="false">
<Columns>
<asp:TemplateField HeaderText="Key" SortExpression="">
<ItemTemplate>
<asp:Label ID="ClientKey" runat="server" Text='<%# Bind("ClientKey") %>' />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Name" SortExpression="">
<ItemTemplate>
<asp:Label ID="ClientName" runat="server" Text='<%# Bind("ClientName") %>' />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Code" SortExpression="">
<ItemTemplate>
<asp:Label ID="ClientCode" runat="server" Text='<%# Bind("ClientCode") %>' />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="IsActive" SortExpression="">
<ItemTemplate>
<asp:CheckBox ID="IsActive" runat="server" Checked='<%# Convert.ToBoolean(Eval("IsActive")) %>'/>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
</div>
<div>
</div>
<div>
<asp:GridView ID="ActiveClients" ShowHeaderWhenEmpty="true" runat="server" CssClass="drag_drop_grid gridview" HeaderStyle-CssClass="gridview-header" AutoGenerateColumns="false">
<Columns>
<asp:TemplateField HeaderText="Key" SortExpression="">
<ItemTemplate>
<asp:Label ID="ClientKey" runat="server" Text='<%# Bind("ClientKey") %>' />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Name" SortExpression="">
<ItemTemplate>
<asp:Label ID="ClientName" runat="server" Text='<%# Bind("ClientName") %>' />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Code" SortExpression="">
<ItemTemplate>
<asp:Label ID="ClientCode" runat="server" Text='<%# Bind("ClientCode") %>' />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="IsActive" SortExpression="">
<ItemTemplate>
<asp:CheckBox ID="IsActive" runat="server" Checked='<%# Convert.ToBoolean(Eval("IsActive")) %>'/>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css" />
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/json2/20130526/json2.min.js"></script>
<script type="text/javascript">
$(function () {
$(".drag_drop_grid").sortable({
items: 'tr:not(tr:first-child)',
cursor: 'arrow',
connectWith: '.drag_drop_grid',
axis: 'x,y',
dropOnEmpty: true,
start: function (e, ui) {
ui.item.addClass("selected");
},
receive: function (e, ui) {
setTimeout(function () {
ui.item.find('[id*=IsActive]').removeAttr('checked');
var obj = {};
obj.ClientKey = $.trim(ui.item.find('[id*=ClientKey]').html());
if (ui.sender[0].id == "InactiveClients") {
obj.IsActive = "true";
ui.item.find('[id*=IsActive]').attr('checked', 'checked');
}
else if (ui.sender[0].id == "ActiveClients") {
obj.IsActive = "false";
ui.item.find('[id*=IsActive]').removeAttr('checked');
}
ui.item.removeClass("selected");
$.ajax({
type: "POST",
url: "Default.aspx/SaveClient",
data: JSON.stringify({ cdata: obj }),
contentType: "application/json; charset=utf-8",
dataType: "json"
});
$(this).find("tbody").append(ui.item);
return false;
}, 100);
},
});
});
</script>
</form>
</body>
</html>
我的代码背后:
using System;
using System.Web.UI;
using System.Data;
using System.Data.SqlClient;
using System.Configuration;
using System.Web.Script.Services;
using System.Web.Services;
namespace DragAndDrop
{
public partial class _default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
if (!Page.IsPostBack)
{
string conString = ConfigurationManager.ConnectionStrings["DefaultConnection"].ConnectionString;
using (SqlConnection con = new SqlConnection(conString))
{
using (SqlCommand cmd = new SqlCommand("SELECT ClientKey, ClientName, ClientCode, IsActive FROM TBLClientData WHERE IsActive = 0 ORDER BY ClientName", con))
{
con.Open();
SqlDataAdapter da = new SqlDataAdapter(cmd);
DataTable dt = new DataTable();
da.Fill(dt);
InactiveClients.UseAccessibleHeader = true;
InactiveClients.DataSource = dt;
InactiveClients.DataBind();
con.Close();
}
using (SqlCommand sqlcmd = new SqlCommand("SELECT ClientKey, ClientName, ClientCode, IsActive FROM TBLClientData WHERE IsActive = 1 ORDER BY ClientName", con))
{
con.Open();
SqlDataAdapter da = new SqlDataAdapter(sqlcmd);
DataTable dt = new DataTable();
da.Fill(dt);
ActiveClients.UseAccessibleHeader = true;
ActiveClients.DataSource = dt;
ActiveClients.DataBind();
con.Close();
}
}
}
}
public class UpdateClient
{
public string ClientKey { get; set; }
public string IsActive { get; set; }
}
[WebMethod]
[ScriptMethod]
public static void SaveClient(UpdateClient cdata)
{
bool isact = Convert.ToBoolean(cdata.IsActive);
string conString = ConfigurationManager.ConnectionStrings["DefaultConnection"].ConnectionString;
using (SqlConnection con = new SqlConnection(conString))
{
using (SqlCommand cmd = new SqlCommand("UPDATE TBLClientData SET IsActive = @IsActive WHERE ClientKey = @ClientKey", con))
{
//cmd.CommandType = CommandType.Text;
con.Open();
cmd.Parameters.AddWithValue("@IsActive", isact);
cmd.Parameters.AddWithValue("@ClientKey", cdata.ClientKey);
cmd.ExecuteNonQuery();
con.Close();
}
}
}
}
}
我的 Global.asax 文件:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Security;
using System.Web.SessionState;
using System.Web.Optimization;
using System.Web.Routing;
namespace DragAndDrop
{
public class Global : System.Web.HttpApplication
{
protected void Application_Start(object sender, EventArgs e)
{
RouteConfig.RegisterRoutes(RouteTable.Routes);
}
protected void Session_Start(object sender, EventArgs e)
{
}
protected void Application_BeginRequest(object sender, EventArgs e)
{
}
protected void Application_AuthenticateRequest(object sender, EventArgs e)
{
}
protected void Application_Error(object sender, EventArgs e)
{
}
protected void Session_End(object sender, EventArgs e)
{
}
protected void Application_End(object sender, EventArgs e)
{
}
}
}
我的 RouteConfig.cs 文件:
using System;
using System.Collections.Generic;
using System.Web;
using System.Web.Routing;
using Microsoft.AspNet.FriendlyUrls;
namespace DragAndDrop
{
public static class RouteConfig
{
public static void RegisterRoutes(RouteCollection routes)
{
var settings = new FriendlyUrlSettings();
settings.AutoRedirectMode = RedirectMode.Permanent;
routes.EnableFriendlyUrls(settings);
}
}
}
如果我在 Global.asax 中注释掉 RouteConfig.RegisterRoutes(RouteTable.Routes);
,记录将在删除后更新。有没有办法在包含 RouteConfig 的同时通过 JSON/SaveClient WebMethod 使 table 更新工作?
我明白了。如果我在 RouteConfig 中设置 settings.AutoRedirectMode = RedirectMode.Off;
它可以解决问题。
我创建了一个拖放功能,允许用户将一行从一个 GridView 拖到另一个 GridView,从而将记录从 Active 更新为 Inactive(反之亦然)。我面临的问题是,当我通过 Global.asax Application_Start 添加 FriendlyUrl RouteConfig 时,记录将不会保存。
我的 HTML 包括 Javascript:
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="default.aspx.cs" Inherits="DragAndDrop._default" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Grids</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:GridView ID="InactiveClients" runat="server" ShowHeaderWhenEmpty="true" CssClass="drag_drop_grid gridview" HeaderStyle-CssClass="gridview-header" AutoGenerateColumns="false">
<Columns>
<asp:TemplateField HeaderText="Key" SortExpression="">
<ItemTemplate>
<asp:Label ID="ClientKey" runat="server" Text='<%# Bind("ClientKey") %>' />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Name" SortExpression="">
<ItemTemplate>
<asp:Label ID="ClientName" runat="server" Text='<%# Bind("ClientName") %>' />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Code" SortExpression="">
<ItemTemplate>
<asp:Label ID="ClientCode" runat="server" Text='<%# Bind("ClientCode") %>' />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="IsActive" SortExpression="">
<ItemTemplate>
<asp:CheckBox ID="IsActive" runat="server" Checked='<%# Convert.ToBoolean(Eval("IsActive")) %>'/>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
</div>
<div>
</div>
<div>
<asp:GridView ID="ActiveClients" ShowHeaderWhenEmpty="true" runat="server" CssClass="drag_drop_grid gridview" HeaderStyle-CssClass="gridview-header" AutoGenerateColumns="false">
<Columns>
<asp:TemplateField HeaderText="Key" SortExpression="">
<ItemTemplate>
<asp:Label ID="ClientKey" runat="server" Text='<%# Bind("ClientKey") %>' />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Name" SortExpression="">
<ItemTemplate>
<asp:Label ID="ClientName" runat="server" Text='<%# Bind("ClientName") %>' />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Code" SortExpression="">
<ItemTemplate>
<asp:Label ID="ClientCode" runat="server" Text='<%# Bind("ClientCode") %>' />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="IsActive" SortExpression="">
<ItemTemplate>
<asp:CheckBox ID="IsActive" runat="server" Checked='<%# Convert.ToBoolean(Eval("IsActive")) %>'/>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css" />
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/json2/20130526/json2.min.js"></script>
<script type="text/javascript">
$(function () {
$(".drag_drop_grid").sortable({
items: 'tr:not(tr:first-child)',
cursor: 'arrow',
connectWith: '.drag_drop_grid',
axis: 'x,y',
dropOnEmpty: true,
start: function (e, ui) {
ui.item.addClass("selected");
},
receive: function (e, ui) {
setTimeout(function () {
ui.item.find('[id*=IsActive]').removeAttr('checked');
var obj = {};
obj.ClientKey = $.trim(ui.item.find('[id*=ClientKey]').html());
if (ui.sender[0].id == "InactiveClients") {
obj.IsActive = "true";
ui.item.find('[id*=IsActive]').attr('checked', 'checked');
}
else if (ui.sender[0].id == "ActiveClients") {
obj.IsActive = "false";
ui.item.find('[id*=IsActive]').removeAttr('checked');
}
ui.item.removeClass("selected");
$.ajax({
type: "POST",
url: "Default.aspx/SaveClient",
data: JSON.stringify({ cdata: obj }),
contentType: "application/json; charset=utf-8",
dataType: "json"
});
$(this).find("tbody").append(ui.item);
return false;
}, 100);
},
});
});
</script>
</form>
</body>
</html>
我的代码背后:
using System;
using System.Web.UI;
using System.Data;
using System.Data.SqlClient;
using System.Configuration;
using System.Web.Script.Services;
using System.Web.Services;
namespace DragAndDrop
{
public partial class _default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
if (!Page.IsPostBack)
{
string conString = ConfigurationManager.ConnectionStrings["DefaultConnection"].ConnectionString;
using (SqlConnection con = new SqlConnection(conString))
{
using (SqlCommand cmd = new SqlCommand("SELECT ClientKey, ClientName, ClientCode, IsActive FROM TBLClientData WHERE IsActive = 0 ORDER BY ClientName", con))
{
con.Open();
SqlDataAdapter da = new SqlDataAdapter(cmd);
DataTable dt = new DataTable();
da.Fill(dt);
InactiveClients.UseAccessibleHeader = true;
InactiveClients.DataSource = dt;
InactiveClients.DataBind();
con.Close();
}
using (SqlCommand sqlcmd = new SqlCommand("SELECT ClientKey, ClientName, ClientCode, IsActive FROM TBLClientData WHERE IsActive = 1 ORDER BY ClientName", con))
{
con.Open();
SqlDataAdapter da = new SqlDataAdapter(sqlcmd);
DataTable dt = new DataTable();
da.Fill(dt);
ActiveClients.UseAccessibleHeader = true;
ActiveClients.DataSource = dt;
ActiveClients.DataBind();
con.Close();
}
}
}
}
public class UpdateClient
{
public string ClientKey { get; set; }
public string IsActive { get; set; }
}
[WebMethod]
[ScriptMethod]
public static void SaveClient(UpdateClient cdata)
{
bool isact = Convert.ToBoolean(cdata.IsActive);
string conString = ConfigurationManager.ConnectionStrings["DefaultConnection"].ConnectionString;
using (SqlConnection con = new SqlConnection(conString))
{
using (SqlCommand cmd = new SqlCommand("UPDATE TBLClientData SET IsActive = @IsActive WHERE ClientKey = @ClientKey", con))
{
//cmd.CommandType = CommandType.Text;
con.Open();
cmd.Parameters.AddWithValue("@IsActive", isact);
cmd.Parameters.AddWithValue("@ClientKey", cdata.ClientKey);
cmd.ExecuteNonQuery();
con.Close();
}
}
}
}
}
我的 Global.asax 文件:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Security;
using System.Web.SessionState;
using System.Web.Optimization;
using System.Web.Routing;
namespace DragAndDrop
{
public class Global : System.Web.HttpApplication
{
protected void Application_Start(object sender, EventArgs e)
{
RouteConfig.RegisterRoutes(RouteTable.Routes);
}
protected void Session_Start(object sender, EventArgs e)
{
}
protected void Application_BeginRequest(object sender, EventArgs e)
{
}
protected void Application_AuthenticateRequest(object sender, EventArgs e)
{
}
protected void Application_Error(object sender, EventArgs e)
{
}
protected void Session_End(object sender, EventArgs e)
{
}
protected void Application_End(object sender, EventArgs e)
{
}
}
}
我的 RouteConfig.cs 文件:
using System;
using System.Collections.Generic;
using System.Web;
using System.Web.Routing;
using Microsoft.AspNet.FriendlyUrls;
namespace DragAndDrop
{
public static class RouteConfig
{
public static void RegisterRoutes(RouteCollection routes)
{
var settings = new FriendlyUrlSettings();
settings.AutoRedirectMode = RedirectMode.Permanent;
routes.EnableFriendlyUrls(settings);
}
}
}
如果我在 Global.asax 中注释掉 RouteConfig.RegisterRoutes(RouteTable.Routes);
,记录将在删除后更新。有没有办法在包含 RouteConfig 的同时通过 JSON/SaveClient WebMethod 使 table 更新工作?
我明白了。如果我在 RouteConfig 中设置 settings.AutoRedirectMode = RedirectMode.Off;
它可以解决问题。