All pastes #2080287 Raw Edit

||cw

public text v1 · immutable
#2080287 ·published 2011-09-08 00:35 UTC
rendered paste body
<html>
<head>
<link rel="stylesheet" type="text/css" href="/yui/build/fonts/fonts-min.css" />
<link rel="stylesheet" type="text/css" href="/yui/build/datatable/assets/skins/sam/datatable.css" />
<script type="text/javascript" src="/yui/build/yahoo-dom-event/yahoo-dom-event.js"></script>
<script type="text/javascript" src="/yui/build/element/element-beta.js"></script>
<script type="text/javascript" src="/yui/build/connection/connection-min.js"></script>
<script type="text/javascript" src="/yui/build/datasource/datasource-beta.js"></script>
<script type="text/javascript" src="/yui/build/datatable/datatable-beta.js"></script>
<script type="text/javascript" src="/yui/build/yahoo-dom-event/yahoo-dom-event.js?_yuiversion=2.5.0"></script>
<script type="text/javascript" src="/yui/build/animation/animation.js?_yuiversion=2.5.0"></script>

</head>
<body>

<form name=frm>
<input type=button value="test" onclick="ShowME()"><br>
<input type=text name=f1><br>
<input type=text name=f2><br>
<input type=text name=f3><br>
</form>

<div class=" yui-skin-sam" id="single"></div>

<script type="text/javascript">

function GridLoaded()
{
	YAHOO.wilson.select_table.singleSelectDataTable.selectRow(YAHOO.wilson.select_table.singleSelectDataTable.getTrEl(20));
	YAHOO.wilson.select_table.singleSelectDataTable.focus();
	ShowME();
}

function RowClick(parm)
{
	console.log(param);
	YAHOO.wilson.select_table.singleSelectDataTable.onEventSelectRow(parm.event, parm.target);
	//ShowME();
}

function RowSelected(parm)
{
	ShowME();
	elScroll = parm.el.parentNode.parentNode.parentNode;
	goTop = elScroll.scrollTop; //default to not moving
	goTopLimit = (elScroll.offsetHeight + elScroll.scrollTop - (parm.el.offsetHeight * 3));
	goBottomLimit = (elScroll.scrollTop + (parm.el.offsetHeight * 2));
	
	if (parm.el.offsetTop > goTopLimit)  //below visible area
	{
		goTop = parm.el.offsetTop - elScroll.offsetHeight + (parm.el.offsetHeight * 3);
	}
	else if(parm.el.offsetTop < goBottomLimit)  //above visible area
	{
		goTop = parm.el.offsetTop - (parm.el.offsetHeight * 2);;
	}
	
	if (goTop < 0) goTop = 0;
	if (!(goTop == elScroll.scrollTop) && (goTop < goTopLimit || goTop > goBottomLimit))  //don't bother animating if we don't need to
	{
		var anim = new YAHOO.util.Scroll(elScroll, { scroll: { to: [0, goTop]} }, .2);
		anim.animate();	
	}
}

function ShowME()
{
	rec = YAHOO.wilson.select_table.singleSelectDataTable.getRecord(YAHOO.wilson.select_table.singleSelectDataTable.getSelectedRows()[0]);
	document.frm.f1.value = rec.getData('description');
}

YAHOO.namespace("wilson"); 
YAHOO.util.Event.addListener(window, "load", function() {
    YAHOO.wilson.select_table = new function() {
        var myColumnDefs = [
        	{key:"category"},
        	{key:"code"},
        	{key:"description"}
        ];

        this.myDataSource = new YAHOO.util.DataSource("http://devtrack/new/index.php?loc=utils.json.getData&embed=1&param=a%3A2%3A%7Bs%3A2%3A%22sp%22%3Bs%3A20%3A%22sp_die_get_die_lists%22%3Bs%3A2%3A%22p0%22%3Bs%3A4%3A%22SHIP%22%3B%7D");
        this.myDataSource.responseType = YAHOO.util.DataSource.TYPE_JSON;  
        this.myDataSource.responseSchema = {
            resultsList: "sp_die_get_die_lists",
            fields: ["category", "code", "description"]
        };

        this.singleSelectDataTable = new YAHOO.widget.DataTable("single",
                myColumnDefs, this.myDataSource, {
                    caption: "data table",
                    selectionMode:"single",
                    scrollable: true,
                    height: "500px"
                });
                
        // Subscribe to events for row selection
        this.singleSelectDataTable.subscribe("rowMouseoverEvent", this.singleSelectDataTable.onEventHighlightRow);
        this.singleSelectDataTable.subscribe("rowMouseoutEvent", this.singleSelectDataTable.onEventUnhighlightRow);
		this.singleSelectDataTable.subscribe("rowClickEvent", RowClick);
		this.singleSelectDataTable.subscribe("rowSelectEvent", RowSelected);
		this.singleSelectDataTable.subscribe("initEvent", GridLoaded);
		
    };
});
</script>

</body>
</html>