asp.net c# and jquery drag and drop

本文关键字：and drag drop jquery asp net | 更新日期: 2023-09-27 18:25:18

我已经进行了jquery的拖放操作。

Div项目落入另一个Div

是否可以用c#处理丢弃的事件？我想将丢弃的项目插入数据库。

或者我是否可以从jquery中调用c#方法并发送一些字符串数据？

asp.net c# and jquery drag and drop

首先，您需要决定一个拖放库，不能通过。JQuery UI。http://jqueryui.com/demos/droppable/也确实想删除元素并对其进行排序，我们来看看。TinySorthttp://tinysort.sjeiti.com/

管理订单的最佳方法是在可拖动面板上添加额外的属性，例如

然后在可丢弃插件的Stop函数上调用一些ajax到一个web方法

--可丢弃

$("#TopBodyPanel").droppable({  drop: function (event, ui) {
 $(ui.draggable).detach().css({ top: 0, left: 0 }).appendTo($(this));
         $.ajax({
        type: 'POST',
        contentType: 'application/json; charset=utf-8',
        data: "{ControlId: '"+ui.draggable.attr('id')+"',contentPosition :'" + ui.draggable.data("order-position") + "',ContainerId: '"+$(this).attr('id'))+"',}",
        dataType: 'json',
        url: $(location).attr('href') + "/UpdatePanelContent",
        success: function (result) 
         { //do something
         },
    });
}});

将信息保存到与登录用户关联的数据库中的xml字段中。

页面加载时。遍历面板容器。

foreach(....){
ControlName.Attributes.Add(dataDefaultIndexAttributeName, pageItem.Index.ToString());
}

然后在HTML 中

$(function() {
   $("#sortable-wide-column-id").children("div").tsort({ attr: 'order-position', order: 'asc' });
}):

我意识到这不是一个端到端的解决方案，但这是我几个月前为登录用户主页的拖放、可排序小部件实现的一些代码。

最简单的答案可能是从将数据插入数据库的"drop"事件处理程序调用web服务。

这个答案有一个从jquery调用web服务的例子，它根据已知的div向它传递一些数据。

相关文章：