Employee Search Box
Type a name or parts of a name (e.g. ma) inside the box provide then select an record from the results.
PHP Source:
<?php
require_once 'raxan/pdi/autostart.php';
Raxan::config('site.timezone','America/Toronto');
class SearchBoxPage extends RaxanWebPage {
protected $db;
protected $infoTpl, $searchTpl;
function _init() {
$this->source('views/searchbox.html');
// Modify this line to connect to your employees table.
// For employee sample data visit http://dev.mysql.com/doc/
//$this->db = Raxan::Connect('mysql: host=localhost; dbname=employees', 'dbuser', 'password');
$this->db = Raxan::connect('examples');
if (!$this->db){
$this->halt('<h2>Unable to connect to the MySQL Database.</h2>
Please make sure you have properly configured your MySQL database connection. <br />
You can download the employee sample database from the MySQL website (<a href="http://dev.mysql.com/doc/">http://dev.mysql.com/doc/</a>)
');
}
}
function _load() {
// event to handle employee click
$this['#results a']->delegate('#click','.employeeClick');
// event to handle auto search
$this['#name']->bind('#keydown',array(
'callback' => '.searchEmployee',
'delay' => 600,
'autoToggle' => 'img#pre',
'serialize' => '#name',
'inputCache' => true
));
// get templates from document
$this->infoTpl = $this['#info']->html();
$this->searchTpl = $this['#results']->html();
}
function employeeClick($e) {
$id = $e->value;
$ds = $this->getEmployeeInfo($id);
$html = Raxan::bindTemplate($ds,array(
'tpl'=>$this->infoTpl,
'removeUnusedTags'=>true,
'format'=>array(
'gender'=>'capitalize',
'hire_date'=>'date: M d, Y',
'birth_date'=>'date: M d, Y'
)
));
C('#info')->hide()
->html($html)
->fadeIn();
}
function searchEmployee($e) {
$html = '';
$rq = $e->page()->clientRequest();
$name = $rq->text('name');
if ($name) {
$name = explode(' ',trim($name),2);
$fname = $name[0];
$lname = isset($name[1]) ? trim($name[1]) : '';
$rows = $this->getEmployees($fname.'%', $lname.'%');
$rows = Raxan::bindTemplate($rows,$this->searchTpl);
$name = $fname.' '.$lname;
if ($rows) $html = '<span class="quiet">Top 10 results for '.$name.'<hr />'.$rows;
else $html = '<span class="quiet">No results found for '.$name.'<hr />'.$rows;
}
C('#results')->html($html);
}
function getEmployees($fname,$lname) {
$sql = "select emp_no,first_name,last_name
from employees where first_name like :fname ".
(($fname && $lname) ? ' and ' : ' or ').
' last_name like :lname limit 10';
$stmt = $this->db->prepare($sql);
$stmt->bindParam(':fname',$fname, PDO::PARAM_STR);
$stmt->bindParam(':lname',$lname, PDO::PARAM_STR);
$stmt->execute();
return $stmt;
}
function getEmployeeInfo($id) {
$sql = "select *,
case gender when 'm' then 'male' when 'f' then 'female' else 'male' end as icon,
case gender when 'm' then 'male' when 'f' then 'female' else 'male' end as gender
from employees where emp_no=:id ";
$stmt = $this->db->prepare($sql);
$stmt->bindParam(':id',$id, PDO::PARAM_INT);
$stmt->execute();
return $stmt;
}
function _prerender(){
$this['#results']->html('');
$this['#info']->html('');
}
}
?>Plugin Source:
HTML Source (views/searchbox.html):
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<title>Employee Search Box</title>
<link href="../raxan/styles/master.css" rel="stylesheet" type="text/css" />
<link href="../raxan/styles/default/theme.css" rel="stylesheet" type="text/css" />
<!--[if IE]><link rel="stylesheet" href="../raxan/styles/master.ie.css" type="text/css"><![endif]-->
<style type="text/css">
#pre { position:absolute; margin:4px 0 0 195px; }
#info label {display:block; float:left}
#name {padding-right:10px;}
#results a {color:#333}
.icon {vertical-align:middle; }
</style>
</head>
<body>
<div class="container c30 prepend-top">
<h2>Employee Search Box</h2>
<!-- Panel HTML Code -->
<div class="panel c12 left front">
<div class="pb1"></div><div class="pb2"></div><div class="pm1">
<form id="webform" class="pad r13" method="post">
Enter Name: <br />
<img class="above hide" id="pre" src="views/images/preloader.gif" width="15" height="15" alt="loading"/>
<input class="c10 textbox" type="text" id="name" name="name" value="" autocomplete="off" />
<div id="results" class="c10">
<img class="icon" src="views/images/user_gray.png" height="16" width="16">
<a href="#{emp_no}">{first_name} {last_name}</a><br />
</div>
</form>
</div><div class="pb2 pb3"></div><div class="pb1 pb4"></div>
</div>
<!-- Panel HTML Code -->
<div class="panel c17 left tpm r13 pull1">
<div class="pb1"></div><div class="pb2"></div><div class="pm1">
<div id="info" class="prepend1 prepend-top">
<img class="column" src="views/images/{icon}.png" alt="Photo" width="64" height="64" />
<div class="column">
<label class="c3">Name</label>: {first_name} {last_name}<br />
<label class="c3">Hire Date</label>: {hire_date}<br />
<label class="c3">Gender</label>: {gender}<br />
<label class="c3">Birth Date</label>: {birth_date}<br />
</div>
</div>
</div><div class="pb2 pb3"></div><div class="pb1 pb4"></div>
</div>
</div>
</body>
</html>Data Source:
Copyright 2008-2009 Raymond Irving and the Raxan Development Team. | Privacy Policy