Sunday, April 26, 2009

Javascript - find object position

Determining DOM object position:
It is one of the AJAX actions when you are trying to attach drop down selection to the existing form field.

Script below helps to identify these coordinates.

obj - is DOM object ( for example some <input type=text name=selectme id=selectme>...</input>

We assume that field height is 20 pixels. Function returns array of X,Y representing left lower corner position of the input field.


//---------------------------------------------------------------------------
function findPos(obj) {
var curleft = curtop = 0;
if (obj.offsetParent) {
curleft = obj.offsetLeft
curtop = obj.offsetTop+20;

while (obj = obj.offsetParent) {
curleft += obj.offsetLeft;
// curleft += 1;
curtop += obj.offsetTop;
}
}
return [curleft,curtop];
}

//-----------------------------------------------------

Example: Dynamically build list of US States.

//-------------------------------------------
// This function is called when user keys in state name or abbreviation
// External php script named getStates.php contains query and
// dynamic generation of the drop down selection. See below

function ajaxStates(obj) {

var state;
var s=obj.value;
var url="getStates.php?keys="+encodeURI(s)+"&addr="+encodeURI(obj.name);
executeXMLHttpRequestStates(url,obj);
}
//-------------------------END ---------------------------------


//-----------getStates.php--------------------------------------

session_start();
$sess=session_name().'='.session_id();

require('config.php'); // contains dbConnection
require(SOME_PATH.'/vendors.php');


$aKeys=$_GET['keys'];
$Elem=$_GET['addr'];
$QBEtrans = new vendors();

$records=$QBEtrans->getStates($aKeys)->getRecords();
$cr=count($records)+1;

echo '';
?>


//-- Query from vendors.php --

#----------------------------------------------------------
protected function pGetStates($key) {

// Get DB Connection from the factory
$dbh = $this->getDBConnection();

$key=$key.'%';

$sql ="select nick,name from states where name like upper(:key) order by name";
$psBindVars = array();
$psBindVars[':key'] =strtoupper($key);


// Prepare starement
$stmt = $dbh->prepare($sql);

$stmt->execute($psBindVars);

// fetch the record
$records = $stmt->fetchAll(PDO::FETCH_ASSOC);

$stmt = null;
$dbh = null;

include_once CLASSPATH.'/ReadOnlyResultSet.php';
return (new ReadOnlyResultSet($records));
}
}

//----------------------------

//----- ReadOnlyResultSet.php -----


class ReadOnlyResultSet {
// This member variable will hold the array of the returned records
private $records;

// transform the PDO::PDOStatement to the array, and assign it
// to the local variable
function __construct($records)
{
if (count($records)>0) {
$this->records = $records;
reset($this->records);
}
}

function getRecords(){
return $this->records;
}

// Receives an instance of the DataObject we're working on
// returns the next element from array
function getNext($dataobject) {
$row = current($this->records);

// Use reflection to fetch the DO's field names
$class = new ReflectionObject($dataobject);
$properties = $class->getProperties();

// Loop through the properties to set them from the current row
for ($i = 0; $i < count($properties); $i++) {
$prop_name = $properties[$i]->getName();
$dataobject->$prop_name = $row[$prop_name];
}
next($this->records);

return $dataobject;
}

// Move the pointer back to the beginning of the result set
function reset() {
$this->records->reset();
}

// Return the number of rows
function rowCount() {
return count($this->records);
}

public function sort($key)
{
for ($i = 0; $i < sizeof($this->records); $i++) {
$sort_values[$i] = $this->records[$i][$key];
}
asort ($sort_values);
reset ($sort_values);
while (list ($arr_key, $arr_val) = each ($sort_values)) {
$sorted_arr[] = $this->records[$arr_key];
}
$this->records = $sorted_arr;
reset($this->records);
}
}
?>

//---------------------------------



I hope this is enough for you to get work started.

0 comments:

Post a Comment