...

View Full Version : help finding a script please



FJbrian
02-03-2007, 01:35 AM
See this script
http://www.activewidgets.com/javascript.forum.10499.2/drag-items-up-and-down.html

I have seen that FREE in several places(script repository type sites) and now that I want to use it, I can't find it.

drag, table, reorder, sort are so common maybe I'm not using the best keywords for my search results

Anyhow, lil' help please

vwphillips
02-03-2007, 02:56 AM
difficult to drag the standard select items up or down(I dont think possible) as a mouse down is recognised as a change.

moving an item up and down from buttons is quite easy.

if this is good enough say and will supply script

FJbrian
02-03-2007, 09:45 PM
sorry this link
http://www.activewidgets.com/grid/

vwphillips
02-04-2007, 10:50 PM
so you want the scrollable table replicated but for free ??

no drag, reorder, sort?

if so I may assist (javascript only, no serverside)

vwphillips
02-05-2007, 01:09 AM
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>
<title></title>

<style type="text/css">
<!--
.cls0 {
width:100px;height:20px;background-Color:#989898;border-Left:solid black 1px;border-Bottom:solid black 1px;padding-Left:5px;
}
.cls1 {
width:100px;height:20px;background-Color:#FFFFCC;border-Left:solid black 1px;border-Bottom:solid black 1px;padding-Left:5px;
}

-->
</style>
<script language="JavaScript" type="text/javascript">
<!--
// Scoll List (04-02-2007) Draft
// by Vic Phillips http://www.vicsjavascripts.org.uk


var zxcRowAry=[];
zxcRowAry[0]=[['title 1','cls0'],['title 1','cls0'],['title 1','cls0']];
zxcRowAry[1]=[['Row 0A','cls1'],['Row 0B','cls1'],['Row 0B','cls1']];
zxcRowAry[2]=[['Row 1A','cls1'],['Row 1B','cls1'],['Row 1B','cls1']];
zxcRowAry[3]=[['Row 2A','cls1'],['Row 2B','cls1'],['Row 2B','cls1']];
zxcRowAry[4]=[['Row 3A','cls1'],['Row 3B','cls1'],['Row 3B','cls1']];
zxcRowAry[5]=[['Row 4A','cls1'],['Row 4B','cls1'],['Row 4B','cls1']];
zxcRowAry[6]=[['Row 5A','cls1'],['Row 5B','cls1'],['Row 5B','cls1']];
zxcRowAry[7]=[['Row 6A','cls1'],['Row 6B','cls1'],['Row 6B','cls1']];
zxcRowAry[8]=[['Row 7A','cls1'],['Row 7B','cls1'],['Row 7B','cls1']];
zxcRowAry[9]=[['Row 8A','cls1'],['Row 8B','cls1'],['Row 8B','cls1']];
zxcRowAry[10]=[['Row 9A','cls1'],['Row 9B','cls1'],['Row 9B','cls1']];
zxcRowAry[11]=[['Row 10A','cls1'],['Row 10B','cls1'],['Row 10B','cls1']];

function zxcInitList(zxcid,zxcary){
var zxcp=document.getElementById(zxcid);
var zxchdr=zxcS('DIV',{position:'absolute',overflow:'hidden',zIndex:'1',left:'0px',top:'0px',width:(pars eInt(zxcp.style.width)-20)+'px',border:'0px'},zxcp);
zxchdr.className=zxcary[0][0][1];
var zxchdrin=zxcS('DIV',{position:'absolute',left:'0px',top:'0px',width:(parseInt(zxcp.style.width)-20)+'px'},zxchdr);
for (var zxc0=0;zxc0<zxcary[0].length;zxc0++){
var zxcd=zxcS('DIV',{position:'absolute',left:((zxc0>0)?zxcd.offsetLeft+zxcd.offsetWidth:0)+'px',top:'0px'},zxchdrin,zxcary[0][zxc0][0]);
zxcd.className=zxcary[0][zxc0][1];
}
var zxclst=zxcS(zxcp.cloneNode(false),{position:'relative',overflow:'scroll',border:'0px'},zxcp);
zxclst.onscroll=function(){ zxcScrollCk(this); }
zxcS(zxchdr,{height:zxcd.offsetHeight+'px'});
zxcS(zxchdr.cloneNode(false),{position:'relative'},zxclst);
for (var zxc1=1;zxc1<zxcary.length;zxc1++){
var zxcrow=zxcS('DIV',{position:'relative'},zxclst);
for (var zxc1a=0;zxc1a<zxcary[zxc1].length;zxc1a++){
var zxcd=zxcS('DIV',{position:'absolute',left:(zxchdrin.childNodes[zxc1a].offsetLeft)+'px',width:(zxchdrin.childNodes[zxc1a].offsetWidth)+'px',top:'0px'},zxcrow,zxcary[zxc1][zxc1a][0]);
zxcd.className=zxcary[zxc1][zxc1a][1];
}
zxcS(zxcrow,{width:(zxcd.offsetLeft+zxcd.offsetWidth)+'px',height:zxcd.offsetHeight+'px'});
}
}

function zxcScrollCk(zxcobj){
zxcS(zxcobj.parentNode.getElementsByTagName('DIV')[0].firstChild,{left:-zxcobj.scrollLeft+'px'});
}

function zxcS(zxcele,zxcstyle,zxcp,zxctxt){
if (typeof(zxcele)=='string'){ zxcele=document.createElement(zxcele); }
for (key in zxcstyle){ zxcele.style[key]=zxcstyle[key]; }
if (zxcp){ zxcp.appendChild(zxcele); }
if (zxctxt){ zxcele.appendChild(document.createTextNode(zxctxt)); }
return zxcele;
}



//-->
</script></head>

<body onload="zxcInitList('Tst1',zxcRowAry);">

<div id="Tst1" style="position:relative;width:300px;height:200px;border:solid black 1px;" >
</div>



</body>

</html>

FJbrian
02-05-2007, 05:33 AM
so you want the scrollable table replicated but for free ??

no drag, reorder, sort?

if so I may assist (javascript only, no serverside)

nah I'd want those. I like the drag reorder and sort but that was extremely kind of you to do that script, thank you very much

vwphillips
02-05-2007, 07:39 AM
with drag and sort


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>
<title></title>

<style type="text/css">
<!--
.cls0 {
width:100px;height:20px;background-Color:#989898;border-Left:solid black 1px;border-Bottom:solid black 1px;padding-Left:5px;
}
.cls1 {
height:20px;background-Color:#FFFFCC;border-Left:solid black 1px;border-Bottom:solid black 1px;padding-Left:5px;
}

.cls2 {
height:20px;background-Color:#CCFFFF;border-Left:solid black 1px;border-Bottom:solid black 1px;padding-Left:5px;
}


-->
</style>
<script language="JavaScript" type="text/javascript">
<!--
// Scoll List (05-02-2007) Draft
// by Vic Phillips http://www.vicsjavascripts.org.uk


var zxcRowAry=[];
zxcRowAry[0]=[['title 1','cls0','Sort Alpha','SortAlpha'],['title 1','cls0','Sort Numeric','SortNumeric'],['title 1','cls0','Optional Title']];
zxcRowAry[1]='DragDrop';
zxcRowAry[2]=[['A-Row 0A','cls1'],['aRow 0B','cls2'],['Row 0B','cls1']];
zxcRowAry[3]=[['B-Row 1A','cls1'],['bRow 1B','cls2'],['Row 1B','cls2']];
zxcRowAry[4]=[['C-Row 2A','cls1'],['cRow 2B','cls2'],['Row 2B','cls1']];
zxcRowAry[5]=[['D-Row 3A','cls1'],['Row 3B','cls2'],['Row 3B','cls2']];
zxcRowAry[6]=[['F-Row 4A','cls1'],['Row 4B','cls2'],['Row 4B','cls1']];
zxcRowAry[7]=[['G-Row 5A','cls1'],['Row 5B','cls2'],['Row 5B','cls2']];
zxcRowAry[8]=[['H-Row 6A','cls1'],['Row 6B','cls2'],['Row 6B','cls1']];
zxcRowAry[9]=[['I-Row 7A','cls1'],['Row 7B','cls2'],['Row 7B','cls2']];
zxcRowAry[10]=[['J-Row 8A','cls1'],['Row 8B','cls2'],['Row 8B','cls1']];
zxcRowAry[11]=[['K-Row 9A','cls1'],['Row 9B','cls2'],['Row 9B','cls2']];
zxcRowAry[12]=[['L-Row 10A','cls1'],['Row 10B','cls2'],['Row 10B','cls1']];

function zxcInitList(zxcid,zxcary){
var zxcp=document.getElementById(zxcid);
var zxchdr=zxcS('DIV',{position:'absolute',overflow:'hidden',zIndex:'1',left:'0px',top:'0px',width:(pars eInt(zxcp.style.width)-20)+'px',border:'0px'},zxcp);
zxchdr.className=zxcary[0][0][1];
var zxclst=zxcS(zxcp.cloneNode(false),{position:'relative',overflow:'scroll',border:'0px'},zxcp);
zxclst.onscroll=function(){ zxcScrollCk(this,zxchdrin); }
var zxchdrin=zxcS('DIV',{position:'absolute',left:'0px',top:'0px',width:(parseInt(zxcp.style.width)-20)+'px'},zxchdr);
for (var zxc0=0;zxc0<zxcary[0].length;zxc0++){
var zxcd=zxcS('DIV',{position:'absolute',left:((zxc0>0)?zxcd.offsetLeft+zxcd.offsetWidth:0)+'px',top:'0px'},zxchdrin,zxcary[0][zxc0][0]);
zxcd.className=zxcary[0][zxc0][1];
zxcd.title=zxcary[0][zxc0][2]||null;
if (zxcary[0][zxc0][3]){
zxcd.fun=zxcary[0][zxc0][3];
zxcd.nu=zxc0;
zxcd.ud=true;
zxcS(zxcd,{cursor:(document.all)?'hand':'pointer'});
zxcd.onmouseup=function(){ zxcSort(this,zxclst,true); }
}
}
zxcS(zxchdr,{height:zxcd.offsetHeight+'px'});
var zxclstin=zxcS('DIV',{position:'relative',left:'0px',top:'0px'},zxclst);
if (window['zxc'+zxcary[1]]){ zxcS(zxclstin,{cursor:'n-resize'}); zxclstin.onmousedown=function(){ window['zxc'+zxcary[1]](); } }
zxcS(zxchdr.cloneNode(false),{position:'relative'},zxclstin);
for (var zxc1=2;zxc1<zxcary.length;zxc1++){
var zxcrow=zxcS('DIV',{position:'relative'},zxclstin);
for (var zxc1a=0;zxc1a<zxchdrin.childNodes.length;zxc1a++){
var zxcd=zxcS('DIV',{position:'absolute',left:(zxchdrin.childNodes[zxc1a].offsetLeft)+'px',width:(zxchdrin.childNodes[zxc1a].offsetWidth)+'px',top:'0px'},zxcrow,zxcary[zxc1][zxc1a][0]);
zxcd.className=zxcary[zxc1][zxc1a][1];
}
zxcS(zxcrow,{overflow:'hidden',width:(zxcd.offsetLeft+zxcd.offsetWidth)+'px',height:zxcrow.firstChil d.offsetHeight+'px'});
}
}

function zxcScrollCk(zxcobj,zxchdrin){
zxcS(zxchdrin,{left:-zxcobj.scrollLeft+'px'});
}

var zxcObj;

function zxcDragDrop(){
var zxcevt=window.event||arguments.callee.caller.arguments[0];
var zxcp=zxcEventObj(zxcevt).parentNode;
var zxcpp=zxcp.parentNode;
zxcObj=null;
if (zxcpp.childNodes.length<4||zxcp.style.overflow!='hidden'){ return; }
zxcobj=zxcS(zxcEventObj(zxcevt).parentNode.cloneNode(true),{position:'absolute',zIndex:'10',top:zxcp .offsetTop+'px'},zxcpp.parentNode);
zxcMseDown(zxcobj,zxcp,zxcMse(zxcevt));
}

function zxcMseDown(zxcobj,zxcp,zxcy){
document.onmousemove=function(event){zxcDrag(event);}
document.onmouseup=function(event){zxcMseUp(event);}
document.onselectstart=function(event){window.event.returnValue=false; }
zxcObj=[zxcobj,zxcobj.offsetTop,zxcy,zxcp];
zxcDragY=zxcMse(event)-zxcObj.offsetTop;
}

function zxcMseUp(event){
if (!zxcObj){ return; }
document.onmouseup=null;
document.onmousemove=null;
document.onselectstart=null;
var zxcclds=zxcObj[3].parentNode.childNodes;
if (zxcObj[0].offsetTop>5||zxcObj[0].offsetTop<zxcObj[0].parentNode.offsetHeight){
for (var zxc0=0;zxc0<zxcclds.length;zxc0++){
if (zxcclds[zxc0].offsetTop>zxcObj[0].offsetTop){
zxcS(zxcObj[0],{position:'relative',top:'0px'});
zxcObj[3].parentNode.insertBefore(zxcObj[0],zxcclds[zxc0]);
zxcObj[3].parentNode.removeChild(zxcObj[3]);
zxcObj=null;
return;
}
}
}
zxcObj[0].parentNode.removeChild(zxcObj[0]);
zxcObj=null;
}

function zxcDrag(event) {
zxcObj[0].style.top=(zxcObj[1]+zxcMse(event)-zxcObj[2])+'px';
}

function zxcMse(event){
if(!event) var event=window.event;
if (document.all){ return event.clientY; }
return event.pageY;
}

function zxcEventObj(zxce){
if (!zxce) var zxce=window.event;
zxce.cancelBubble=true;
if (zxce.stopPropagation) zxce.stopPropagation();
if (zxce.target) zxceobj=zxce.target;
else if (zxce.srcElement) zxceobj=zxce.srcElement;
if (zxceobj.nodeType==3) zxceobj=zxceobj.parentNode;
return zxceobj;
}

function zxcEventAdd(zxco,zxct,zxcf) {
if ( zxco.addEventListener ){ zxco.addEventListener(zxct, function(e){ zxco[zxcf](e);}, false); }
else if ( zxco.attachEvent ){ zxco.attachEvent('on'+zxct,function(e){ zxco[zxcf](e); }); }
else {
var zxcPrev=zxco["on" + zxct];
if (zxcPrev){ zxco['on'+zxct]=function(e){ zxcPrev(e); zxco[zxcf](e); }; }
else { zxco['on'+zxct]=zxco[zxcf]; }
}
}

var zxcEvt=0;

function zxcAddEvt(zxc,zxcfun,zxcevt){
zxc['zxcaddEvt'+zxcEvt]=window[zxcfun];
zxcEventAdd(zxc,zxcevt,'zxcaddEvt'+zxcEvt);
zxcEvt++;
}

var zxcSortCol;

function zxcSort(zxcobj,zxclst,zxcud){
zxcSortCol=zxcobj.nu;
var zxcrows=zxclst.firstChild.childNodes;
var zxcary=[];
for (var zxc1=1;zxc1<zxcrows.length;zxc1++){
zxcary.push(zxcrows[zxc1].cloneNode(true));
}
zxcary=zxcary.sort(window['zxc'+zxcobj.fun]);
if (zxcobj.ud){ zxcary=zxcary.reverse(); }
for (var zxc2=0;zxc2<zxcary.length;zxc2++){
zxcrows[zxc2+1].parentNode.replaceChild(zxcary[zxc2],zxcrows[zxc2+1]);
}
zxcobj.ud=!zxcobj.ud;
}

function zxcSortAlpha(zxca,zxcb){
var zxcaa=zxca.childNodes[zxcSortCol].firstChild.data;
var zxcbb=zxcb.childNodes[zxcSortCol].firstChild.data;
if (zxcaa<zxcbb) return -1;
if (zxcaa>zxcbb) return 1;
return 0;
}

function zxcSortNumeric(zxca,zxcb){
var zxcaa=zxca.childNodes[zxcSortCol].firstChild.data.replace(/\D/g,'');
var zxcbb=zxcb.childNodes[zxcSortCol].firstChild.data.replace(/\D/g,''); ;
if (zxcaa<zxcbb) return -1;
if (zxcaa>zxcbb) return 1;
return 0;
}

function zxcS(zxcele,zxcstyle,zxcp,zxctxt){
if (typeof(zxcele)=='string'){ zxcele=document.createElement(zxcele); }
for (key in zxcstyle){ zxcele.style[key]=zxcstyle[key]; }
if (zxcp){ zxcp.appendChild(zxcele); }
if (zxctxt){ zxcele.appendChild(document.createTextNode(zxctxt)); }
return zxcele;
}



//-->
</script>

</head>

<body onload="zxcInitList('Tst1',zxcRowAry);">

<div id="Tst1" style="position:relative;width:300px;height:200px;border:solid black 1px;" >
</div>

</body>

</html>

FJbrian
02-05-2007, 08:03 AM
you're awesome, thank you!



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum