ultragrid.htc

具备表头拖拽、交换列、排序、添加 、修改、删除、选择等等功能的。NET GRID

	set objSizeItem = document.createElement("DIV")
	with objSizeItem.style
		.backgroundColor = "buttonshadow"
		if ie6 then .cursor = "col-resize" else .cursor = "e-resize"
		.position = "absolute"
		.border = "outset 1px"
		.width = "2px"
		.zIndex = 3000
		.visibility = "hidden"
	end with
	window.document.body.insertAdjacentElement "afterBegin", objSizeItem
	set objDragItem = document.createElement("DIV")
	with objDragItem.style
		.font = "menu"
		.backgroundColor = "buttonshadow"
		.cursor = "hand"
		.position = "absolute"
		.filter = "progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=45)"
		.zIndex = 3001
		.visibility = "hidden"
	end with
	window.document.body.insertAdjacentElement "afterBegin", objDragItem
	set objDragToItem1 = document.createElement("DIV")
	with objDragToItem1
		.style.height = 9
		.style.width  = 9
		.innerHTML = "<img src='" & posDownImageUrl & "'>"
		.style.backgroundColor = "transparent"
		.style.position = "absolute"
		.style.zIndex = 3000
		.style.visibility = "hidden"
	end with
	window.document.body.insertAdjacentElement "afterBegin", objDragToItem1
	set objDragToItem2 = document.createElement("DIV")
	with objDragToItem2
		.style.height = 9
		.style.width  = 9
		.innerHTML = "<img src='" & posUpImageUrl & "'>"
		.style.backgroundColor = "transparent"
		.style.position = "absolute"
		.style.zIndex = 3000
		.style.visibility = "hidden"
	end with
	window.document.body.insertAdjacentElement "afterBegin", objDragToItem2
	set objHeadMenu = document.createElement("DIV")
	txtHTML = "<div class=" & chr(34) & "coolMenuItem" & chr(34) & " style='padding-top: 1px;' onclick=" & chr(34) & "vbscript: " & element.id & ".sortAscending" & chr(34) & "><img src=" & chr(34) & sortAscImageUrl & chr(34) & " width=" & chr(34) & "16" & chr(34) & " height=" & chr(34) & "16" & chr(34) & ">按升序排序</div>" _
			& "<div class=" & chr(34) & "coolMenuItem" & chr(34) & " style='padding-top: 1px;' onclick=" & chr(34) & "vbscript: " & element.id & ".sortDescending" & chr(34) & "><img src=" & chr(34) & sortDesImageUrl & chr(34) & " width=" & chr(34) & "16" & chr(34) & " height=" & chr(34) & "16" & chr(34) & ">按降序排序</div>" _
			& "<div class=" & chr(34) & "coolMenuDivider" & chr(34) & "></div>" _
			& "<div class=" & chr(34) & "coolMenuItem" & chr(34) & " style='padding-top: 1px;' onclick=" & chr(34) & "vbscript: " & element.id & ".intShowEditHeadObject" & chr(34) & "><img src=" & chr(34) & transparentImageUrl & chr(34) & " width=" & chr(34) & "16" & chr(34) & " height=" & chr(34) & "16" & chr(34) & ">重命名</div>" _
			& "<div class=" & chr(34) & "coolMenuDivider" & chr(34) & "></div>" _
			& "<div class=" & chr(34) & "coolMenuItem" & chr(34) & " style='padding-top: 1px;' onclick=" & chr(34) & "vbscript: " & element.id & ".removeColumn" & chr(34) & "><img src=" & chr(34) & transparentImageUrl & chr(34) & " width=" & chr(34) & "16" & chr(34) & " height=" & chr(34) & "16" & chr(34) & ">隐藏列</div>" _
			& "<div class=" & chr(34) & "coolMenuItem" & chr(34) & " style='padding-top: 1px;' onclick=" & chr(34) & "vbscript: " & element.id & ".showFieldChooser" & chr(34) & "><img src=" & chr(34) & fieldChooserImageUrl & chr(34) & " width=" & chr(34) & "16" & chr(34) & " height=" & chr(34) & "16" & chr(34) & ">字段选择...</div>"
	with objHeadMenu
		.className = "coolMenu"
		.innerHTML = txtHTML
	end with
	window.document.body.insertAdjacentElement "afterBegin", objHeadMenu

	set objWindow = document.createElement("DIV")
	txtHTML = "<div class=" & chr(34) & "windowCaption" & chr(34) & " id=" & chr(34) & element.id & "_capText" & chr(34) & ">字段选择</div><img class=" & chr(34) & "captionImage" & chr(34) & " src=" & chr(34) & fieldChooserImageUrl & chr(34) & " width=" & chr(34) & "16" & chr(34) & " height=" & chr(34) & "16" & chr(34) & ">" _
			& "<span class=" & chr(34) & "captionButton" & chr(34) & " id=" & chr(34) & element.id & "_btnMin" & chr(34) & "><img></span>" _
			& "<span class=" & chr(34) & "captionButton" & chr(34) & " id=" & chr(34) & element.id & "_btnMax" & chr(34) & "><img></span>" _
			& "<span class=" & chr(34) & "captionButton" & chr(34) & " id=" & chr(34) & element.id & "_btnClose" & chr(34) & "><img></span>" _
			& "<iframe class=" & chr(34) & "windowContent" & chr(34) & " id=" & chr(34) & element.id & "_winContent" & chr(34) & "></iframe>"
	with objWindow
		.id = element.id & "_fcWindow"
		.className = "coolWindowEx"
		.innerHTML = txtHTML
		.style.visibility = "hidden"
	end with
	window.document.body.insertAdjacentElement "afterBegin", objWindow
end sub


'event routines

function parentWindowOnMouseDown()
	dim el, clk
	if not window.event is nothing then
		set el = window.event.srcElement
		if not el is nothing then
			if inEdit and el.id <> "cellEdit" and el.id <> "headCellEdit" then
				hidingObject = true
				hideEditObject false
				exit function
			end if
			if (el.tagName = "IMG") then
				set el = el.parentElement
			end if
			if el.className = "coolMenuItem" then
				hidingObject = false
				set clk = el.onclick
				if not clk is nothing then clk
			end if
		end if
	end if
	if inMenu then
		hidingObject = parentIsGrid(el)
		hideMenu()
		with window.event
			.cancelBubble = true
			.returnValue = false
		end with
		parentWindowOnMouseDown = false
	else
		hidingObject = false
	end if
	set el = nothing
	set clk = nothing
end function

function elementOnSelect()
	if inEdit then
		with window.event
			.cancelBubble = false
			.returnValue = true
		end with
		elementOnSelect = true
	else
		with window.event
			.cancelBubble = true
			.returnValue = false
		end with
		elementOnSelect = false
	end if
end function

function elementOnResize()
	dim elClientHeight, elClientWidth
	with element
		elClientHeight = .clientHeight
		elClientWidth = .clientWidth
	end with
	if elClientHeight < gridHeadHeight or elClientWidth < 1 then exit function
	with gridBody
		.style.height = elClientHeight - gridHeadHeight
		.style.width = elClientWidth
		gridHeadRow.style.marginLeft = - .scrollLeft
	end with
	setGridHeadWidth elClientHeight, elClientWidth, gridBody.clientHeight
end function

function elementOnMouseMove()
	dim x, y
	dim cliX, cliY
	with window.event
		.cancelBubble = true
		.returnValue = false
		cliX = .clientX
		cliY = .clientY
	end with
	if (inSize and not objSizeItem is nothing) then
		setOffsets x, y
		if cliX > gridHeadRow.children(menuHeadIndex).offsetLeft + 15 + x then _
			objSizeItem.style.posLeft = cliX - 1
	elseif (inDrag and not objDragItem is nothing) then
		if iDragCounter < 10 then
			iDragCounter = iDragCounter + 1
			exit function
		end if
		with objDragItem
			if (.style.visibility = "hidden") then .style.visibility = "visible"
			.style.posLeft = cliX - (.offsetWidth / 2)
			.style.posTop  = cliY - (.offsetHeight - 3)
		end with
		dragHeadHitIndex = hitTest(cliX, cliY)
	end if
end function

function elementOnMouseUp()
	dim sizeEndPos
	if inSize then
		inSize = false
		sizeEndPos = objSizeItem.offsetLeft
		objSizeItem.style.visibility = "hidden"
		element.releaseCapture
		sizeCol menuHeadIndex, sizeEndPos - sizeStartPos
	elseif inDrag then
		inDrag = false
		objDragItem.style.visibility = "hidden"
		objDragToItem1.style.visibility = "hidden"
		objDragToItem2.style.visibility = "hidden"
		element.releasecapture
		element.style.cursor = "default"
		if iDragCounter < 10 then exit function
		if dragHeadHitIndex <> -1 then moveCols menuHeadIndex, dragHeadHitIndex
	end if
end function

sub elementOnPropertyChange
	dim elChild, elChildChild
	if window.event.propertyName = "editStyle" then
		if inEdit then hideEditObject false
	elseif window.event.propertyName = "selectionStyle" then
		if inEdit then hideEditObject false
		selectedCellCount = 0
		selectedRowCount = 0
		set cSelectedCells = nothing
		set cSelectedRows = nothing
		if cint(selectionStyle) = 0 then
			'no selection
		elseif cint(selectionStyle) = 1 then
			set cSelectedCells = new clsSelectedObjects
		elseif cint(selectionStyle) = 2 then
			set cSelectedRows = new clsSelectedObjects
		end if
		for each elChild in gridBody.children
			if elChild.id <> "cellEdit" then
				with elChild
					if cint(selectionStyle) = 0 then
						.style.border = "1px solid window"
					elseif cint(selectionStyle) = 1 then
						.style.border = "none"
					elseif cint(selectionStyle) = 2 then
						.style.border = "1px solid window"
					end if
					for each elChildChild in elChild.children
						with elChildChild
							if cint(selectionStyle) = 0 then
								.style.border = "none"
								.runtimeStyle.color = ""
								.runtimeStyle.backgroundColor = ""
								if elChildChild is elChild.children(elChild.children.length - 1) then elChildChild.style.width = gridHeadRow.children(elChild.children.length - 1).offsetWidth - 2
							elseif cint(selectionStyle) = 1 then
								.style.border = "1px solid window"
								.runtimeStyle.color = ""
								.runtimeStyle.backgroundColor = ""
								if elChildChild is elChild.children(elChild.children.length - 1) then elChildChild.style.width = gridHeadRow.children(elChild.children.length - 1).offsetWidth
							elseif cint(selectionStyle) = 2 then
								.style.border = "none"
								.runtimeStyle.color = ""
								.runtimeStyle.backgroundColor = ""
								if elChildChild is elChild.children(elChild.children.length - 1) then elChildChild.style.width = gridHeadRow.children(elChild.children.length - 1).offsetWidth - 2
							end if
						end with
					next
				end with
			end if
		next
		cellselect.fire
		rowselect.fire
		setRowColors()
	end if
end sub

function gridHeadOnMouseMove()
	dim ev, el, hitIndex, x, y
	if inDrag or inSize or inMenu or inEdit then exit function
	set ev = window.event
	set el = ev.srcElement
	do while (el.tagName <> "SPAN")
		set el = el.parentElement
	loop
	if el.children.length = 0 then exit function
	hitIndex = getElementIndex(el)
	if hitIndex <> -1 then
		if ev.offsetX >= gridHeadRow.children(hitIndex).offsetWidth - 3 then
			if ie6 then el.style.cursor = "col-resize" else el.style.cursor = "e-resize"
		else
			el.style.cursor = "hand"
		end if
	end if
	set ev = nothing
	set el = nothing
end function

function gridHeadOnMouseDown()
	dim el, x, y
	dim cliX, cliY
	if inMenu or inEdit then exit function
	if hidingObject then
		hidingObject = false
		exit function
	end if
	with window.event
		set el = .srcElement
		cliX = .clientX
		cliY = .clientY
		.cancelBubble = true
		.returnValue = false
	end with
	do while (el.tagName <> "SPAN")
		set el = el.parentElement
	loop
	if inEdit and el.id <> "cellEdit" and el.id <> "headCellEdit" then hideEditObject false
	if el.children.length = 0 then exit function
	menuHeadIndex = getElementIndex(el)
	if el.style.cursor = "col-resize" or el.style.cursor = "e-resize" then
		inSize = true
		sizeStartPos = cliX
		element.setCapture
		setOffsets x, y
		with objSizeItem.style
			.top = y
			.height = element.offsetHeight
			.left = cliX
			if (.visibility = "hidden") then .visibility = "visible"
		end with
	else
		if getVisibleCount() < 2 then exit function
		inDrag = true
		iDragCounter = 0
		element.setcapture
		element.style.cursor = "hand"
		with objDragItem
			.innerHTML = "<center>" & el.innerHTML & "</center>"
			with .style
				.color = el.currentStyle.color
				.height = el.offsetHeight - 2
				.width  = el.offsetWidth - 2
			end with
		end with
	end if
	set el = nothing
end function

function gridHeadOnClick()
	dim el, sortIndex
	if inMenu or inEdit then exit function
	if hidingObject then
		hidingObject = false
		exit function
	end if
	set el = window.event.srcElement
	do while (el.tagName <> "SPAN")
		set el = el.parentElement
	loop
	with el
		if .children.length = 0 then exit function
		if .children(0).id <> "srtImg" then exit function
		sortIndex = getElementIndex(el)
		if instr(right(.children(0).src, instrrev(.children(0).src, "/")), right(sortDownImageUrl, instrrev(sortDownImageUrl, "/"))) <> 0 then
			.children(0).src = sortUpImageUrl
			sortTable sortIndex, "UP"
		else
			.children(0).src = sortDownImageUrl
			sortTable sortIndex, "DOWN"
		end if
	end with
	if prevMenuHeadIndex <> -1 and prevMenuHeadIndex <> sortIndex then
		gridHeadRow.children(prevMenuHeadIndex).children(0).src = sortNoneImageUrl
	end if
	prevMenuHeadIndex = sortIndex
	set el = nothing
end function

function gridHeadOnRightClick()
	dim ev, el
	if inEdit then exit function
	set ev = window.event
    with ev
		set el = .srcElement
		do while (el.tagName <> "SPAN")
			set el = el.parentElement
		loop
		if el.children.length = 0 then exit function
		menuHeadIndex = getElementIndex(el)
		showMenu objHeadMenu, .clientX, .clientY
		.cancelBubble = true
		.returnValue = false
	end with
	gridHeadOnRightClick = false
	set el = nothing
	set ev = nothing
end function

function gridBodyOnScroll()
	dim el
	set el = window.event.srcElement
	gridHeadRow.style.marginLeft = - el.scrollLeft
	set el = nothing
end function

function gridBodyOnMouseOver()
	dim el
	if inMenu or inEdit then exit function
	set el = window.event.srcElement
	if cint(selectionStyle) = 0 then
		'no selection
	elseif cint(selectionStyle) = 1 then
		if not cSelectedCells.QuerySelected(el) then
			if (el.tagName = "SPAN") then setCurrentCell el
		else
			setCurrentCell nothing
		end if
	elseif cint(selectionStyle) = 2 then
		if (el.tagName = "SPAN") then
			set el = el.parentElement
		end if
		if not cSelectedRows.QuerySelected(el) then
			if el.parentElement.className = "gridBody" then setCurrentRow el
		else
			setCurrentRow nothing
		end if
	end if
	set el = nothing
end function

function gridBodyOnMouseOut()
	if inMenu then exit function
	if cint(selectionStyle) = 0 then
		'no selection
	elseif cint(selectionStyle) = 1 then
		setCurrentCell nothing
	elseif cint(selectionStyle) = 2 then
		setCurrentRow nothing
	end if
end function

function gridBodyOnClick()
	dim el, i, r, c, tElement
	if hidingObject then
		hidingObject = false
		exit function
	end if
	set el = window.event.srcElement
	if cint(selectionStyle) = 0 then
		'no selection
	elseif cint(selectionStyle) = 1 then
		if el.tagName <> "SPAN" then exit function
		if window.event.shiftKey then
			dim lastCell
			set lastCell = cSelectedCells.LastObject
			if not lastCell is nothing then
				dim startCell, endCell, startRow, endRow, saveIndex
				startCell = getElementIndex(el)
				endCell = getElementIndex(lastCell)
				startRow = getElementIndex(el.parentElement)
				endRow = getElementIndex(lastCell.parentElement)
				if startCell > endCell then
					saveIndex = startCell
					startCell = endCell
					endCell = saveIndex
				end if
				if startRow > endRow then
					saveIndex = startRow
					startRow = endRow
					endRow = saveIndex
				end if
				for r = startRow to endRow
					with gridBody.children(r)
						for c = startCell to endCell
							setCellStyle .children(c), "highlighttext", "highlight", "highlight"
							if not cSelectedCells.QuerySelected(.children(c)) then cSelectedCells.Add .children(c)
						next
					end with
				next
				cSelectedCells.setLastObject el
				set lastCell =  nothing
				set currentObject = nothing
			else
				cSelectedRows.AddSingle el
				setCellStyle el, "highlighttext", "highlight", "highlight"
				set currentObject = nothing
			end if
		elseif window.event.ctrlKey then
			if cSelectedCells.QuerySelected(el) then
				cSelectedCells.Remove el
				setCellStyle el, "windowtext", el.style.backgroundColor, el.parentElement.style.backgroundColor
				setCurrentCell el
			else
				cSelectedCells.Add el
				setCellStyle el, "highlighttext", "highlight", "highlight"
				set currentObject = nothing
			end if
		else
			if cSelectedCells.QuerySelected(el) then
				if ucase(editStyle) = "AUTO" then showEditObject el
				exit function
			end if
			if cSelectedCells.Count > 0 then
				for i = 0 to cSelectedCells.Count - 1
					set tElement = cSelectedCells.SelectedObject(i)
					setCellStyle tElement, "windowtext", tElement.style.backgroundColor, tElement.parentElement.style.backgroundColor
					set tElement = nothing
				next
			end if