[racktables-users] POC: filtering select boxes
- From: "Farrington, Ryan" <rfarrington@xxxxxxxxxxxxx>
- To: <racktables-users@xxxxxxxxxxxxx>
- Date: Thu, 15 Apr 2010 19:08:49 -0400
Playing around inside the code, I implemented something I think should
be shared with the group.
The problem I was running into is when I was using the dropdown box to
select a single item, the list was too long and, personally, a little
difficult to scroll through. I knew what I was looking for but with
hundreds of items in the list it was a little daunting.
My solution was to modify the select box to allow for an dhtml filter.
This way I could freeform type into the field and it would supply an
auto complete type list below the select with valid values.
I have a lot of customization in the code for other reasons so I can't
post the complete files but attached is the files in the necessary file
structure and below is the snips of a diff that should get you close
enough. There are 2 .js files, a stylesheet (.css), and the images
necessary to make it work. All the credit for the java code goes to
DHTMLX LTD except for the small fix I put in place that forces the load
AFTER the document completely loads.
interface.php
search for "function printOpFormIntro", add id=${opname} into
the form element, not necessary but I like doing it.
-- code snip --
echo "<form method=post id=${opname} name=${opname}
action='process.php?page=${pageno}&tab=${tabno}&op=${opname}'";
-- end snip --
Search for "function renderIPv4AddressAllocations" we are adding
the logic for the dynamic search here because I do not know where else
to put it
In that function replace the function printNewItemTR() with the
snip below
-- code snip --
function printNewItemTR ()
{
global $aat;
printOpFormIntro ('addIPv4Allocation');
echo "<script>";
echo "window.dhx_globalImgPath='/pix/';";
echo "</script>";
echo "<script src='js/dhtmlxcommon.js'></script>";
echo "<script src='js/dhtmlxcombo.js'></script>";
echo "<link rel='STYLESHEET' type='text/css'
href='/css/dhtmlxcombo.css'>";
echo "<tr><td>";
printImageHREF ('add', 'allocate', TRUE);
echo "</td><td>";
printSelect (getNarrowObjectList ('IPV4OBJ_LISTSRC'),
array ('name' => 'object_id', 'tabindex' => 100, 'id' => 'object_id'));
echo "<script>$(document).ready(function() {var
z=dhtmlXComboFromSelect('object_id');z.enableFilteringMode(true);})</scr
ipt>";
echo "</td><td><input type=text tabindex=101
name=bond_name size=10></td><td>";
printSelect ($aat, array ('name' => 'bond_type',
'tabindex' => 102), 'regular');
echo "</td><td>";
printImageHREF ('add', 'allocate', TRUE, 103);
echo "</td></form></tr>";
}
-- end snip --
Ryan Farrington
Senior Systems Engineer
MedAssets
5556 Tennyson Pkwy
Suite 200
Plano TX 75024
Direct - 972-244-0312
Cell - (972) 757-3028
The information transmitted is intended only for the person or entity to which
it is addressed and may contain confidential, proprietary, and/or privileged
material. Any review, retransmission, dissemination or other use of, or taking
of any action in reliance upon this information by persons or entities other
than the intended recipient is prohibited. If you received this in error,
please contact the sender and delete the material from all computers
Other related posts:
