Drag& Drop Grouping动画不起作用

时间:2012-04-19 15:09:25

标签: asp.net ajax telerik dotnetnuke radgrid

我在RADGrid上启用了分组,但是当我拖动时删除一列,我看到的只是拖动时的“CrossHair”光标。我没有看到动画在视觉上显示一个表示被拖动列的框,也没有看到出现的“双箭头”,显示了要删除列的位置。我在Telerik RADGrid Demo上看到的这些功能,但我似乎可以在我自己的RADGrid上复制这个功能。

帮助!

2 个答案:

答案 0 :(得分:0)

尝试以下链接。这将帮助您降低拖拽效果。 我现在也使用这种方法。我的DNN是版本6.x

http://www.telerik.com/community/forums/aspnet-ajax/grid/unknown-server-tag-telerik-griddragdropcolumn.aspx

*编辑: 在Page_Load中调用以下方法(这只是为了在页面上动态获取脚本块。您还必须在我的链接中执行所描述的步骤):

public void subDragDropJavaScript()
{
  // define the script string to add to the page
  StringBuilder sJavaScript = new StringBuilder();
  // js header
  sJavaScript.Append(("<script type=\'text/javascript\'>" + "\r\n"));
  sJavaScript.Append("function startRowDrag_ModuleID_"+ this.ModuleId + "_GridID_" + oDNNGrid.ID + "(row, args)" + "\r\n");
  sJavaScript.Append("{" + "\r\n");
  sJavaScript.Append("var target = args.target || args.srcElement;" + "\r\n");
  sJavaScript.Append("if (target.className.indexOf('rgDrag') > -1)" + "\r\n");
  sJavaScript.Append("{" + "\r\n");
  sJavaScript.Append("args._isDragHandle = true;" + "\r\n");
  sJavaScript.Append("var tableView = $find(row.id.split('__')[0]);" + "\r\n");
  sJavaScript.Append("var grid = $find(tableView.get_owner().get_id());" + "\r\n");
  sJavaScript.Append("tableView.get_dataItems();" + "\r\n");
  sJavaScript.Append("$find(row.id).set_selected(true);" + "\r\n");
  sJavaScript.Append("var origFunc = Telerik.Web.UI.RadGrid.prototype._canRiseRowEvent;" + "\r\n");
  sJavaScript.Append("Telerik.Web.UI.RadGrid.prototype._canRiseRowEvent = function ()" + "\r\n");
  sJavaScript.Append("{" + "\r\n");
  sJavaScript.Append("var el = arguments[0].target || arguments[0].srcElement;" + "\r\n");
  sJavaScript.Append("return origFunc.apply(grid, arguments) || el.tagName.toLowerCase() == 'img';" + "\r\n");
  sJavaScript.Append("}" + "\r\n");
  sJavaScript.Append("grid._mouseDown(args);" + "\r\n");
  sJavaScript.Append("Telerik.Web.UI.RadGrid.prototype._canRiseRowEvent = origFunc;" + "\r\n");
  sJavaScript.Append("}" + "\r\n");
  sJavaScript.Append("}" + "\r\n");
  sJavaScript.Append("function gridRowDragStarted_ModuleID_" + this.ModuleId + "_GridID_" + oDNNGrid.ID + "(sender, args) {" + "\r\n");
  sJavaScript.Append("if (!args.get_domEvent()._isDragHandle) {" + "\r\n");
  sJavaScript.Append("args.set_cancel(true);" + "\r\n");
  sJavaScript.Append("}" + "\r\n");
  sJavaScript.Append("}" + "\r\n");

  // js close block
  sJavaScript.Append("</script>");
  // add js block to page
  this.Page.ClientScript.RegisterStartupScript(typeof(string), "DragnDropRowSelection_" + ModuleId, sJavaScript.ToString());
}

最好的问候, 没有人

答案 1 :(得分:0)

我知道这是一个旧帖子,但我最近才找到答案。

在我的自定义模块的Module.css中,我添加了以下代码:

.RadGrid
{
    z-index: 1000;
}

显然,DNN框架的default.css使模块的z-index高于网格,从而掩盖了动画。将z-index增加到网格本身会将其放在模块上方,从而允许动画再次显示。