我正在尝试用列表框实现 C# 拖放。
我在互联网上找到了一些代码片段,但似乎都不能满足我的需求。
我希望你能告诉我一个如何在ListBox中移动行的示例代码。
我的代码如下。
我的代码如下,谢谢
.cs
public partial class DragDrop : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
string constr = ConfigurationManager.ConnectionStrings["cn"].ConnectionString;
string query = "SELECT * FROM City LIMIT 10;";
using (MySqlConnection con = new MySqlConnection(constr))
{
using (MySqlCommand cmd = new MySqlCommand(query))
{
using (MySqlDataAdapter sda = new MySqlDataAdapter())
{
cmd.Connection = con;
sda.SelectCommand = cmd;
using (DataSet ds = new DataSet())
{
sda.Fill(ds);
ListBox1.DataSource = ds.Tables[0];
ListBox1.DataTextField = "Name";
ListBox1.DataValueField = "Name";
ListBox1.DataBind();
}
}
}
}
}
}
.aspx
<script src="http://ajax.aspnetcdn.com/ajax/jquery/jquery-1.8.0.js" type="text/javascript"></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.8.22/jquery-ui.js"></script>
<link rel="Stylesheet" href="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.8.10/themes/redmond/jquery-ui.css" />
<script type="text/javascript">
$(function () {
$(".drag_drop_grid").sortable({
items: 'tr:not(tr:first-child)',
cursor: 'crosshair',
connectWith: '.drag_drop_grid',
axis: 'y',
dropOnEmpty: true,
receive: function (e, ui) {
$(this).find("tbody").append(ui.item);
}
});
$("[id*=ListBox2] tr:not(tr:first-child)").remove();
});
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ListBox ID="ListBox1" runat="server"
SelectionMode="Multiple"
Height="100"
Width="100"
Font-Names="Verdana"
EnableViewState="true"></asp:ListBox>
<asp:ListBox ID="ListBox2" runat="server"
Height="100"
Width="100"
Font-Names="Verdana"></asp:ListBox>
</div>
</form>
</body>
</html>
希望这能帮助你。
http:/rajudasa.blogspot.com201111drag-and-drop-list-items-with-multi.html。
在这里,你会发现关于在网页上通过拖放选择项目的信息,以及我如何使用JQuery-UI Sortable在listBoxes中创建可拖放项目。
在JQuery-UI Sortable演示页面上,列表项被表示为 "列表"。<li>
我试着用 <li>
和 <td>
作为项目,它们都不符合我的要求。而不是使用 <li>
作为项目,我用 <div>
标签。其中一个必要的功能是,多选拖放使用的是 ctrl + mouse drag
.
示例演示页面包含2个Listboxes(源,目标)。源框中的项目来自JSON数据(静态或来自Asp.Net)。点击按钮后,目标框中被选中的项目以JSON字符串的形式存储在一个隐藏字段中,你可以在服务器端取回它们。(或者在JS版本中,只需填写一个文本区域)。
你可以查看 演示
下载 Zip文件在这里