创建可拖动列的DataGrid（2）

最新推荐文章于 2017-01-15 11:55:00 发布

xwqjamky

最新推荐文章于 2017-01-15 11:55:00 发布

阅读量782

点赞数

分类专栏： Datagrid 文章标签： datagrid function insert dataset null import

本文链接：https://blog.csdn.net/xwqjamky/article/details/507973

版权

Datagrid 专栏收录该内容

71 篇文章 0 订阅

订阅专栏

<%@ Page Language="VB" EnableViewState = "false"%>
<%@ import namespace="System" %>
<%@ import namespace="System.Data" %>
<%@ import namespace="System.Web.UI" %>
<%@ import namespace="System.Web.UI.WebControls" %>
<%@ import namespace="System.Xml" %>
<script language="VB" runat="server">
Public nColumn As Int32 = 0
Sub Page_Load(ByVal sender As System.Object, ByVal e As System.EventArgs)
  Dim _dsContacts As DataSet
   ' 装载XML数据原，注意：这里与数据原类型没有关系，换成数据库也是适用的
   _dsContacts = New DataSet()
   _dsContacts.ReadXml(Server.MapPath("mxh.xml"))
   Dim dcPk As DataColumn() = {_dsContacts.Tables("Contact").Columns("Email")}
   _dsContacts.Tables("Contact").PrimaryKey = dcPk
  nColumn = _dsContacts.Tables("Contact").Columns.Count
  MyTable.Attributes.Add("dragcolor","gray")
  MyTable.Attributes.Add("slcolor","#ffffcc")
  MyTable.Attributes.Add("hlcolor","#BEC5DE")

   If Not Page.IsPostBack Then
      ' 只在页面首次请求时才进行数据绑定
     Dim dv As DataView = New DataView(_dsContacts.Tables("Contact"))
     dv.Sort = "LastName, FirstName"
     MyTable.DataSource = dv
     MyTable.DataBind()
   End If
End Sub
Sub MyTable_ItemCreated(sender As Object, e As DataGridItemEventArgs)
  If e.Item.ItemType=ListItemType.Header Then
   Dim i As Int32
   For i = 0 To nColumn - 1
    '//能否拖放的关键一句
    e.Item.Cells(i).Attributes.Add("Width","200")
   Next
  End If
End Sub
</script>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<HTML>
<HEAD>
    <meta name="GENERATOR" Content="Microsoft Visual Studio 7.0">
    <META http-equiv="Content-Type" content="text/html; charset=gb2313">
    <title>DataGrid拖动的例子</title>
    <meta name="CODE_LANGUAGE" Content="VB">
    <meta name="vs_defaultClientScript" content="JavaScript">
    <meta name="vs_targetSchema" content="http://schemas.microsoft.com/intellisense/ie5">
</HEAD>
<body>
<div align="center"><b>DataGrid拖动列、排序的例子,放在aspx运行目录下即可直接运行。</b></div>
    <form id="idbSample" method="post" runat="server" class="SubHeading">
      <asp:DataGrid id="MyTable" runat="server" AutoGenerateColumns="True"
       Style="behavior:url(tableAct.htc);" Width="100%" Cellpadding = "3"
       OnItemCreated="MyTable_ItemCreated" BorderColor="#000099">
    <HeaderStyle Font-Bold="True" BackColor="#ffcc66" HorizontalAlign="center"></HeaderStyle>
      </asp:DataGrid>
    </form>
</body>
</HTML>

<public:event name="onrowselect" ID=rowSelect />
<public:property name="hlColor" />
<public:property name="slColor" />
<public:property name='dragColor' />

<PUBLIC:ATTACH EVENT="ondetach" ONEVENT="cleanup()" />
<public:attach event=oncontentready onevent="init();" />

if (element.tagName == 'TABLE')
{
element.attachEvent('onmouseover', onMouseOver);
element.attachEvent('onmouseout', onMouseOut);
element.attachEvent('onclick', onClick);
}
else
{
alert("错误");
}

function cleanup()
{
hilite(-1);

element.detachEvent('onmouseover', onMouseOver);
element.detachEvent('onmouseout', onMouseOut);
element.detachEvent('onclick', onClick);
}

function onClick()
{
srcElem = window.event.srcElement;
while (srcElem.tagName != "TR" && srcElem.tagName != "TABLE")
srcElem = srcElem.parentElement;

if(srcElem.tagName != "TR") return;

if(srcElem.rowIndex == 0 ) return;

if (selRow != -1) selRow.runtimeStyle.backgroundColor = '';

srcElem.runtimeStyle.backgroundColor = slColor;
selRow = srcElem;

var oEvent = createEventObject();
oEvent.selected = selRow;
rowSelect.fire(oEvent);
}

//找到所在的行，然后决定是否改变背景颜色
function onMouseOver()
{
srcElem = window.event.srcElement;
//crawl up to find the row
while (srcElem.tagName != "TR" && srcElem.tagName != "TABLE")
srcElem = srcElem.parentElement;

if(srcElem.tagName != "TR") return;

if (srcElem.rowIndex > 0)
hilite(srcElem);
else
hilite(-1);

}

function onMouseOut()
{
hilite(-1, -1);
}

function hilite(newRow)
{
if (hlColor != null )
{
  if (currRow != -1 && currRow!=selRow)
  {
   currRow.runtimeStyle.backgroundColor = '';
  }

  if (newRow != -1 && newRow!=selRow)
  {
   newRow.runtimeStyle.backgroundColor = hlColor;
  }
}
currRow = newRow;
}

var tbody=null;
var theadrow=null;
var colCount = null;

var reverse = false;
var lastclick = -1;

var arrHitTest = new Array();
var bDragMode = false;
var objDragItem;
var arrHitTest = new Array();
var iArrayHit = false;

function init() {
var MytHead = element.createTHead();
MytHead.appendChild(element.rows[0]);
element.deleteRow(1);
tbody = element.tBodies(0);
if (!tbody) return;
var thead = element.tHead;
if (!thead) return;

theadrow = thead.children[0]; //假定只有一行Head
if (theadrow.tagName != "TR") return;

theadrow.runtimeStyle.cursor = "hand";

colCount = theadrow.children.length;
var l, clickCell;
var cx=0;
var cy=0;
var c;

for (var i=0; i<colCount; i++)
{
  l=document.createElement("IMG");
  l.src="dude07232001blank.gif";
  l.id="srtImg";
  l.width=25;
  l.height=11;

  clickCell = theadrow.children[i];
  clickCell.selectIndex = i;
  clickCell.insertAdjacentElement("beforeEnd", l)
  clickCell.attachEvent("onclick", doClick);

arrHitTest[i] = new Array();

c = clickCell.offsetParent;

    if(cx == 0 && cy == 0 )
    {
     while (c.offsetParent != null) {
                  cy += c.offsetTop;
                  cx += c.offsetLeft;
                  c = c.offsetParent;
  }
}

arrHitTest[i][0] = cx + clickCell.offsetLeft;
arrHitTest[i][1] = cy + clickCell.offsetTop;
arrHitTest[i][2] = clickCell;
arrHitTest[i][3] = cx + clickCell.offsetLeft + eval(clickCell.width);

clickCell.attachEvent("onmousedown",onMouseDown);
}

defaultTitleColor = theadrow.children[0].currentStyle.backgroundColor;

element.document.attachEvent("onmousemove",onMouseMove);
element.document.attachEvent("onmouseup",onMouseUp);
element.document.attachEvent("onselectstart",onSelect);
}

function doClick(e)
{
var clickObject = e.srcElement;

while (clickObject.tagName != "TD")
{
clickObject = clickObject.parentElement;
}

var imgcol= theadrow.all('srtimg');
for(var x = 0; x < imgcol.length; x++)
imgcol[x].src = "dude07232001blank.gif";

if(lastclick == clickObject.selectIndex)
{
  if(reverse == false)
  {
   clickObject.children[0].src = "dude07232001down.gif";
        reverse = true;
  }
  else
  {
   clickObject.children[0].src = "dude07232001up.gif";
   reverse = false;
  }
}
else
{
  reverse = false;
  lastclick = clickObject.selectIndex;
  clickObject.children[0].src = "dude07232001up.gif";
}

insertionSort(tbody, tbody.rows.length-1, reverse, clickObject.selectIndex);
}

function insertionSort(t, iRowEnd, fReverse, iColumn)
{
var iRowInsertRow, iRowWalkRow, current, insert;
    for ( iRowInsert = 0 + 1 ; iRowInsert <= iRowEnd ; iRowInsert++ )
    {
        if (iColumn) {
  if( typeof(t.children[iRowInsert].children[iColumn]) != "undefined")
             textRowInsert = t.children[iRowInsert].children[iColumn].innerText;
  else
   textRowInsert = "";
        } else {
           textRowInsert = t.children[iRowInsert].innerText;
        }

        for ( iRowWalk = 0; iRowWalk <= iRowInsert ; iRowWalk++ )
        {
            if (iColumn) {
   if(typeof(t.children[iRowWalk].children[iColumn]) != "undefined")
    textRowCurrent = t.children[iRowWalk].children[iColumn].innerText;
   else
    textRowCurrent = "";
            } else {
   textRowCurrent = t.children[iRowWalk].innerText;
            }

current = textRowCurrent;
insert = textRowInsert;

  if ( !isNaN(current) || !isNaN(insert))
  {
   current= eval(current);
   insert= eval(insert);
  }
  else
  {
   current = current.toLowerCase();
   insert = insert.toLowerCase();
  }

            if ( (   (!fReverse && insert < current)
                 || ( fReverse && insert > current) )
                 && (iRowInsert != iRowWalk) )
            {
      eRowInsert = t.children[iRowInsert];
                eRowWalk = t.children[iRowWalk];
                t.insertBefore(eRowInsert, eRowWalk);
                iRowWalk = iRowInsert; // done
            }
        }
    }
}

function InitHeader()
{
var cx=0;
var cy=0;
var c;

for (i=0; i<colCount ; i++) {

var clickCell = theadrow.children[i];
clickCell.selectIndex = i;
c = clickCell.offsetParent;

if(cx == 0 && cy == 0 )
{
  while (c.offsetParent != null) {
                  cy += c.offsetTop;
                  cx += c.offsetLeft;
                  c = c.offsetParent;
  }
}

arrHitTest[i][0] = cx + clickCell.offsetLeft;
arrHitTest[i][1] = cy + clickCell.offsetTop;
arrHitTest[i][2] = clickCell;
arrHitTest[i][3] = cx + clickCell.offsetLeft + eval(clickCell.width);
}
}

function onSelect()
{
return false;
}

function ChangeHeader(iChange)
{
for(var y = 0; y < arrHitTest.length; y++)
{
if (arrHitTest[y][2].currentStyle.backgroundColor == dragColor)
arrHitTest[y][2].style.backgroundColor = defaultTitleColor;
}

if(iChange == "-1") return;

arrHitTest[iChange][2].style.backgroundColor = dragColor;
}

function onMouseUp(e)
{
if(!bDragMode) return;
bDragMode = false;

var iSelected = objDragItem.selectIndex;

objDragItem.removeNode(true);
objDragItem = null;

ChangeHeader(-1);

if( (iArrayHit - 1) < 0 || iSelected < 0) return;

CopyRow(iSelected, (iArrayHit - 1) );

iSelected = 0;
iArrayHit = -1;
}

function onMouseDown(e)
{
bDragMode = true;
var src = e.srcElement;
var c = e.srcElement;

while (src.tagName != "TD")
  src = src.parentElement;
objDragItem = document.createElement("DIV");
objDragItem.innerHTML  = src.innerHTML;
objDragItem.style.height = src.currentStyle.height;
objDragItem.style.width = src.currentStyle.width;
objDragItem.style.background = src.currentStyle.backgroundColor;
objDragItem.style.fontColor = src.currentStyle.fontColor;
objDragItem.style.position = "absolute";
objDragItem.selectIndex  = src.selectIndex;
while (c.offsetParent != null)
        {
  objDragItem.style.y += c.offsetTop;
  objDragItem.style.x += c.offsetLeft;
  c = c.offsetParent;
}
  objDragItem.style.borderStyle = "outset";
objDragItem.style.display = "none";
src.insertBefore(objDragItem);
}

function onMouseMove(e)
{
if(!bDragMode || !objDragItem) return;

var midWObj = objDragItem.style.posWidth / 2;
var midHObj = 12;

var intTop = e.clientY + element.document.body.scrollTop;
var intLeft = e.clientX + element.document.body.scrollLeft;

var cx=0,cy=0;
var elCurrent = objDragItem.offsetParent;
               while (elCurrent.offsetParent != null) {
                  cx += elCurrent.offsetTop;
                  cy += elCurrent.offsetLeft;
                  elCurrent = elCurrent.offsetParent;
               }

objDragItem.style.pixelTop = intTop - cx - midHObj;
objDragItem.style.pixelLeft = intLeft - cy - midWObj;

if(objDragItem.style.display == "none") objDragItem.style.display = "";

iArrayHit = CheckHit(intTop , intLeft , e);

e.cancelBubble = false;
e.returnValue = false;
}

function CheckHit(x,y,e)
{
midWObj = objDragItem.style.posWidth / 2;
midHObj = 12;

if( ((x) > (arrHitTest[0][1] + 20) ) || ( (x) < (arrHitTest[0][1]) ) )
{
ChangeHeader(-1);
return -1;
}

for(var i=0; i < colCount; i++)
{
  if( (y) > (arrHitTest[i][0]) && (y) < (arrHitTest[i][3] )) //+ 100))
  {
   ChangeHeader(i);
   return i + 1;
  }
}
return -1;
}

function CopyRow(from, to)
{
if(from == to) return;

var origfrom = from;
var origto = to;
var iDiff = 0;

if( from > to )
{

iDiff = from - to;

var saveObj = theadrow.children[from].innerHTML;
var saveWidth = theadrow.children[from].width;

  for(var i = 0 ; i < iDiff; i++)
  {
   theadrow.children[from].innerHTML = theadrow.children[from - 1].innerHTML;
   theadrow.children[from].width = theadrow.children[from - 1].width;
   from--;
  }
  theadrow.children[to].innerHTML = saveObj;
  theadrow.children[to].width = saveWidth;

}
else
{

iDiff = to - from;

var saveObj = theadrow.children[from].innerHTML;
var saveWidth = theadrow.children[from].width;

  for(var i = 0 ; i < iDiff; i++)
  {
   theadrow.children[from].innerHTML = theadrow.children[from + 1].innerHTML;
   theadrow.children[from].width = theadrow.children[from + 1].width;
   from++;
  }

theadrow.children[to].innerHTML = saveObj;
theadrow.children[to].width = saveWidth;
}

for(var i = 0 ; i < theadrow.children.length; i++)
theadrow.children[i].selectIndex = i;

InitHeader();
for ( var iRowInsert = 0 ; iRowInsert < tbody.rows.length; iRowInsert++ )
{
  from = origfrom;
  to = origto;
  if( from > to )
  {
   iDiff = from - to;
   var saveObj = tbody.children[iRowInsert].children[from].innerHTML
   for(var i = 0 ; i < iDiff; i++)
   {
    tbody.children[iRowInsert].children[from].innerHTML = tbody.children[iRowInsert].children[from - 1].innerHTML;
    from--;
   }
   tbody.children[iRowInsert].children[to].innerHTML = saveObj;

  }
  else
  {
   iDiff = to - from;
   var saveObj = tbody.children[iRowInsert].children[from].innerHTML
   for(var i = 0 ; i < iDiff; i++)
   {
    tbody.children[iRowInsert].children[from].innerHTML = tbody.children[iRowInsert].children[from + 1].innerHTML;
    from++;
   }
   tbody.children[iRowInsert].children[to].innerHTML = saveObj;
  }
}
}

</script>

xwqjamky

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
创建可拖动列的DataGrid（2）

Public nColumn As Int32 = 0 Sub Page_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Dim _dsContacts As DataSet 装载XML数据原，注意：这里与数据原类型没有关系，换成数据库也是适用的 _dsContacts = New DataSet()
复制链接

扫一扫