Moved all of the jqGrid search javascript into its own file to prevent duplication when including more than one grid on a page. I also put search boxes directly into the jqGrid element, with the requested fields passed in as a parameter. I've got the autosearch mechanism tied across all grids, but search and reload is grid specific. This was mostly to get the code into an extensible spot, but the layout is not yet desirable. I'll yank the search boxes on the next checkin not that its proven out.

git-svn-id: file:///svn-source/pmgr/branches/ledger_transactions_20090605@123 97e9348a-65ac-dc4b-aefc-98561f571b83
This commit is contained in:
abijah
2009-06-14 23:16:35 +00:00
parent 015e6b082d
commit 4d49ad6516
5 changed files with 74 additions and 140 deletions

View File

@@ -12,7 +12,6 @@ if (0) { // REVISIT<AP>: Need to figure out how to put this in play
}
$cols['Comment'] = array('index' => 'Contact.comment', 'formatter' => 'comment');
//pr($contacts);
$jqGrid_options = array('jqGridColumns' => $cols,
'controller' => 'contacts',
'caption' => isset($caption) ? $caption : null);
@@ -25,5 +24,6 @@ if (isset($contacts)) {
'limit' => 5);
}
//pr($jqGrid_options);
$jqGrid_options += array('search_fields' => array('Last Name', 'First Name'));
echo $this->element('jqGrid', $jqGrid_options);

View File

@@ -11,25 +11,18 @@ $cols['First Name'] = array('index' => 'PrimaryContact.first_name', 'formatter
$cols['Leases'] = array('index' => 'lease_count', 'width' => '60');
$cols['Comment'] = array('index' => 'Customer.comment', 'formatter' => 'comment');
echo $this->element('jqGrid',
array('jqGridColumns' => $cols));
$jqGrid_options = array('jqGridColumns' => $cols,
'controller' => 'customers',
'caption' => isset($caption) ? $caption : null);
?>
if (isset($customers)) {
$jqGrid_options += array('custom_ids' =>
array_map(create_function('$data',
'return $data["id"];'),
$customers),
'limit' => 5);
}
<div>Search By:<BR>
<input type="checkbox" id="autosearch" onclick="enableAutosubmit(this.checked)" CHECKED>Enable Autosearch<BR>
Last Name<BR>
<input type="text" CLASS="filt-text" id="filt_last_name" name="PrimaryContact.last_name" />
<button CLASS="filt-submit" ID="submit_filt_last_name" style="margin-left:30px;">Search</button><BR>
First Name<BR>
<input type="text" CLASS="filt-text" id="filt_first_name" name="PrimaryContact.first_name" />
<button CLASS="filt-submit" ID="submit_filt_first_name" style="margin-left:30px;">Search</button><BR>
<div>
<button CLASS="filt-clear" ONCLICK="gridRestore()">Clear</button>
</div>
</div>
$jqGrid_options += array('search_fields' => array('Last Name', 'First Name'));
echo $this->element('jqGrid', $jqGrid_options);

View File

@@ -24,8 +24,12 @@ if (!isset($height))
if (!isset($controller))
$controller = $this->params['controller'];
if (!isset($gridId))
$gridId = $controller . '-jqGrid';
if (!isset($grid_id))
$grid_id = $controller . '-jqGrid';
if (!isset($search_fields))
$search_fields = array();
// Do some prework to bring in the appropriate libraries
$imgpath = '/pmgr/site/css/jqGrid/basic/images';
@@ -34,6 +38,7 @@ $html->css('jqGrid/jqModal', null, null, false);
$javascript->link('jqGrid/jquery.jqGrid.js', false);
$javascript->link('jqGrid/js/jqModal', false);
$javascript->link('jqGrid/js/jqDnR', false);
$javascript->link('pmgr_jqGrid', false);
// Define the URL to fetch data from.
@@ -80,7 +85,7 @@ foreach ($jqGridColumns AS &$col) {
$default = array();
// Make sure every column has a name
$default['name'] = $col['index'];
$default['name'] = preg_replace("/\./", '-', $col['index']);
// Perform customization based on formatter
if (isset($col['formatter'])) {
@@ -135,7 +140,7 @@ jQuery(document).ready(function(){
$(el).html('#'+cellval);
}
jQuery('#<?php echo $gridId; ?>').jqGrid(
jQuery('#<?php echo $grid_id; ?>').jqGrid(
<?php
echo FormatHelper::phpVarToJavascript
(array('mtype' => 'GET',
@@ -150,34 +155,34 @@ jQuery(document).ready(function(){
'caption' => $caption,
'imgpath' => $imgpath,
'viewrecords' => true,
'pager' => array('--special' => "jQuery('#{$gridId}-pager')"),
'pager' => array('--special' => "jQuery('#{$grid_id}-pager')"),
//'toolbar' => array(true,"bottom"),
)); ?>
);
/* jQuery('#t_<?php echo $gridId; ?>').height(25).hide() */
/* .filterGrid('#<?php echo $gridId; ?>', { */
/* jQuery('#t_<?php echo $grid_id; ?>').height(25).hide() */
/* .filterGrid('#<?php echo $grid_id; ?>', { */
/* gridModel:true, */
/* gridToolbar:true, */
/* autosearch:true, */
/* }); */
/* jQuery('#<?php echo $gridId; ?>').navGrid('#<?php echo $gridId; ?>-pager', */
/* jQuery('#<?php echo $grid_id; ?>').navGrid('#<?php echo $grid_id; ?>-pager', */
/* { view:false, */
/* edit:false, */
/* add:false, */
/* del:false, */
/* search:false, */
/* refresh:false}) */
/* .navButtonAdd('#<?php echo $gridId; ?>-pager',{ */
/* .navButtonAdd('#<?php echo $grid_id; ?>-pager',{ */
/* caption:"Search", */
/* title:"Toggle Search", */
/* buttonimg:'<?php echo $imgpath; ?>' + '/find.gif', */
/* onClickButton:function(){ */
/* if(jQuery('#t_<?php echo $gridId; ?>').css("display")=="none") { */
/* jQuery('#t_<?php echo $gridId; ?>').css("display",""); */
/* if(jQuery('#t_<?php echo $grid_id; ?>').css("display")=="none") { */
/* jQuery('#t_<?php echo $grid_id; ?>').css("display",""); */
/* } else { */
/* jQuery('#t_<?php echo $gridId; ?>').css("display","none"); */
/* jQuery('#t_<?php echo $grid_id; ?>').css("display","none"); */
/* } */
/* } */
/* }); */
@@ -186,112 +191,34 @@ jQuery(document).ready(function(){
--></script>
<table id="<?php echo $gridId; ?>" class="scroll"></table>
<div id="<?php echo $gridId; ?>-pager" class="scroll" style="text-align:center;"></div>
<div id="debug"></div>
<table id="<?php echo $grid_id; ?>" class="scroll"></table>
<div id="<?php echo $grid_id; ?>-pager" class="scroll" style="text-align:center;"></div>
<script type="text/javascript"><!--
<?php
if (count($search_fields) > 0) {
echo('<div>Search By:<BR>' . "\n");
echo('<input type="checkbox" CLASS="filt-autosearch"'.
' onclick="enableAutosubmit(this.checked)" CHECKED>'.
'Enable Autosearch' .
'<BR>' . "\n");
/************************************************************************
*
* Example search boxes that work with the javascript form this element
<div>Search By:<BR>
<input type="checkbox" id="autosearch" onclick="enableAutosubmit(this.checked)">Enable Autosearch<BR>
Last Name<BR>
<input type="text" CLASS="filt-text" id="filt_last_name" name="PrimaryContact.last_name" />
<button CLASS="filt-submit" ID="submit_filt_last_name" style="margin-left:30px;">Search</button><BR>
First Name<BR>
<input type="text" CLASS="filt-text" id="filt_first_name" name="PrimaryContact.first_name" />
<button CLASS="filt-submit" ID="submit_filt_first_name" style="margin-left:30px;">Search</button><BR>
<div>
<button CLASS="filt-clear" ONCLICK="gridRestore()">Clear</button>
</div>
</div>
*
*/
var timeoutHnd;
function handleFiltKeydown(e){
/* $('#debug').append("KEYDOWN: id:"+id+"<BR>"); */
if (e.which == 8 || e.which == 46 || /* Backspace / Delete */
e.which == 32 || /* Space */
(65 <= e.which && e.which < 65 + 26) || /* Upper Case */
(97 <= e.which && e.which < 97 + 26)) /* Lower Case */
{
var id = $(this).attr('id');
if(timeoutHnd)
clearTimeout(timeoutHnd);
timeoutHnd = setTimeout(function()
{gridFilter(id)},
500);
foreach ($search_fields AS $field) {
echo($field . "<BR>\n");
echo('<input type="text" CLASS="filt-text filt-text-'.$grid_id.'"' .
' id="filt_'.$jqGridColumns[$field]['name'].'"' .
' filt-grid="'.$grid_id.'"' .
' filt-index="'.$jqGridColumns[$field]['index'].'"' .
'/>' . "\n");
echo('<button CLASS="filt-submit filt-submit-'.$grid_id.'"' .
' id="submit_'.$jqGridColumns[$field]['name'].'"' .
' style="margin-left:30px;">' .
'Search' .
'</button><BR>' . "\n");
}
}
function enableAutosubmit(state) {
jQuery(".filt-submit").attr("disabled",state);
if (state) {
$(".filt-text").keydown(handleFiltKeydown);
/* $('#debug').append("BIND: id:"+id+"<BR>"); */
}
else {
$(".filt-text").unbind('keydown', handleFiltKeydown);
/* $('#debug').append("UNBIND: id:"+id+"<BR>"); */
}
}
function gridRestore() {
/* $('#debug').append("RESTORE<BR>"); */
$('.filt-text').val('');
jQuery('#<?php echo $gridId; ?>').removePostDataItem('filt');
jQuery('#<?php echo $gridId; ?>').removePostDataItem('filtField');
jQuery('#<?php echo $gridId; ?>').removePostDataItem('filtValue');
jQuery('#<?php echo $gridId; ?>')
.setGridParam({ page: 1 })
.trigger("reloadGrid");
}
function gridFilter(id) {
var field = jQuery("#"+id).attr('name');
var value = jQuery("#"+id).val();
// Make sure we're not issuing blank queries.
// It will work without observable effect, but
// it will result in slower queries. Just
// clear out all filter terms instead.
if (value == '') {
gridRestore();
return;
echo('<div>' . "\n");
echo('<button CLASS="filt-clear" ONCLICK="'."gridRestore('$grid_id')".'">' .
'Clear' .
'</button>' . "\n");
echo('</div>' . "\n");
echo('</div>' . "\n");
}
/* $('#debug').append("RELOAD: field:"+field+"; value:"+value+"<BR>"); */
jQuery('#<?php echo $gridId; ?>').setPostDataItem('filt', true);
jQuery('#<?php echo $gridId; ?>').setPostDataItem('filtField', field);
jQuery('#<?php echo $gridId; ?>').setPostDataItem('filtValue', value);
$('.filt-text').each(function(){
if ($(this).attr('id') != id)
$(this).val('');
});
jQuery('#<?php echo $gridId; ?>')
.setGridParam({ page: 1 })
.trigger("reloadGrid");
}
jQuery(document).ready(function(){
$('.filt-submit').click(function(){
gridFilter($(this).attr('id').replace(/^submit_/, ''));
});
enableAutosubmit(true);
});
--></script>

View File

@@ -11,6 +11,18 @@ $cols['Move-Out'] = array('index' => 'Lease.moveout_date', 'formatter' => 'dat
$cols['Balance'] = array('index' => 'Lease.balance', 'formatter' => 'currency');
$cols['Comment'] = array('index' => 'Lease.comment', 'formatter' => 'comment');
echo $this->element('jqGrid',
array('jqGridColumns' => $cols));
$jqGrid_options = array('jqGridColumns' => $cols,
'controller' => 'leases',
'caption' => isset($caption) ? $caption : null);
if (isset($leases)) {
$jqGrid_options += array('custom_ids' =>
array_map(create_function('$data',
'return $data["id"];'),
$leases),
'limit' => 5);
}
$jqGrid_options += array('search_fields' => array('Customer', 'Unit'));
echo $this->element('jqGrid', $jqGrid_options);

View File

@@ -83,6 +83,8 @@
<!-- LAYOUT TABLE -->
</TABLE>
<div id="debug"></div>
<?php echo $cakeDebug; ?>
<?php /* pr($this); */ ?>