I am having the same problem in IE6 but hope to have it sorted with the following functions which normally do the job for other popups that I have. You just need to run the respective function from the show/hide triggers of your popups.
function hideDrops() {
var drops = document.getElementsByTagName('select');
for (i = 0; i < drops.length; i++) {
drops[i].style.display = 'none';
}
}
function showDrops() {
var drops = document.getElementsByTagName('select');
for (i = 0; i < drops.length; i++) {
drops[i].style.display = 'none';
}
}
You can of course be more specific as to which Tags/Divs etc you wish to show/hide by using document.getElementById('your_element_id')
Now where will those triggers be in the auto-complete code?
Edit:
This worked for me! Assuming you have also entered the above mentioned functions too.
After Line:163> actb_display = true;
type> hideDrops();
After Line:365> actb_display = false;
type> showDrops();
After Line:381> actb_display = 0;
type> showDrops();
Hi I used the actb control (v1.31) for a text area. Once text area has some (multiple line) text, up and down arrow keys cant be used to move up down in text area. Only left and right arrow keys work.
For a text area user do need to be able to browse using all arrow keys to edit existing content.
I’m investigating your code and it seems really good!!.
I wander if you can help me to do this task,
I have to auto complete e-mail, so what I want is after the user type “@ “ show a list of possible e-mail list.
Is it possible to do with your code??
Suppose this, I have entered in the array this code..
var customarray=new Array('hotmail.com','yahoo.com');
What I want this :
When the user type martin@hot--> apperars in the windows “ hotmail.com”, then the user select the correct option and then add his selection to the userEmnail
Ex martin@hot
add martin@hotmail.com
Appears hotmail.com
hello sir
we are college students.I read your abstract .
very nice.we need a project details on IMAGEZIPPING by today
please help us
please send the details to shibaji4219@yahoo.co.in
I've only been testing it in firefox though, and when I went to use it in IE (6), i noticed that the list shows up BEHIND other select dropdown boxes on the form page I'm using.
I've tried various things like setting a, r, and c.zIndex to be 5 and the select to be 1, and I've read some things about iframes, but I'm wondering if anyone knows of a more elegant solution or something I should investigate concerning this.
This is because SELECT elements in IE 6 and earlier are implemented as so-called "windowed" controls. Windowed controls ignore z-index and always appear in front. iframes are also windowed controls, and it sounds like one hack you've stumbled onto suggests using iframes to get things to show up in front of the pesky SELECT controls. The other workarounds I've seen are (a) hide all SELECTs on the form whenever anything is displayed that *might* be obstructed (ugly), (b) modify the form layout so SELECTs are never in the way.
I'm trying to append the "," after an item has been selected. Could someone show me how to do that or show me the code where it's returning the item? Thanks...
(1) In actb.js, ensure delimiters initialized: this.actb_delimiter = new Array(';', ',');
(2) In actb.js, add a new parameter to function actb() as actb(obj, ca, mouseSelectCallback);
fire this callback at the end of actb_mouseclick like this:
// The click event handler for the suggest table.
function actb_mouseclick(evt)
{
...
// Callback is fired when selection is made by mouse.
if (mouseSelectCallback)
{
mouseSelectCallback(actb_curr);
}
}
(3) Define these functions in your own script:
<script language="javascript">
function mouseSelectCallback()
{
// Append "," after a selection is made.
var textbox = document.getElementById('myTextbox');
textbox.value += ",";
}
function onKeyUpHandler(textbox, evt)
{
var keyCode;
if (window.event) keyCode = window.event.keyCode;
else if (evt && evt.which) keyCode = evt.which;
else if (evt && evt.charCode) keyCode = evt.charCode;
// Enter and Tab key are the selection keys.
if (keyCode == 13 || keyCode == 9)
mouseSelectCallback();
}
function enableACTB(textbox)
{
var obj = actb(textbox, myArray, mouseSelectCallback);
}
</script>
(4) Respond to these events of your textbox:
<input type="text" id="myTextbox" onkeyup="onKeyUpHandler(this, event);"
onfocus="enableACTB(this);">
I not understand code
what is 'tat_table'
why getelementbyid('tat_table')
i have problem in my project
i have two input box and use two array that query from database
two box use different array,from dirrerent field that have different data
one box use array1 and the other one use array2
but it show autocomplete in same array
Help me please
If u not understand that i explain u can e-mail to
supalak_cpe@hotmail.com
Some pages in my Web application contain drop down lists (HTML select tag) that have very long list of items. Using the up and down keys or scroll bar to find an item is not always easy. My manager wants some convenient ways to find an item from a very long drop down list.
After much researh on the Internet and I found this wonderful Auto-complete Control. Thanks to Zichun and all contributors! This is exactly what we wanted!
With some tweaks to actb.js, I was able to implement our incremental search functionality for a HTML select tag. Here's a summary of changes:
(1) Make it possible for the client to respond to the event when selection is made by mouse.
- A mouseSelectCallback is passed to function actb() as actb(obj,ca, mouseSelectCallback);
- Fire the mouseSelectCallback at the end of function actb_mouseclick();
(2) Pair a navigatin row (row with /\ or \/) with place holder row when necessary to make sure
user won't accidently select an item when using mouse to navigate the list.
(3) Make sure the key events are still alive even after mouse is used to navigate. This is done
by ensuring that it's not in mouse navigation mode before remove all events in function
atcb_clear().
(4) Add some global variable to control the styles of the navigation row.
Here's the code:
function actb(obj,ca, mouseSelectCallback){
/* ---- Public Variables ---- */
.
.
.
// Insert a up-arrow navigation row to the specified suggestTable.
function actb_add_up_arrow_row(suggestTable)
{
c = actb_add_nav_row(0, suggestTable, actb_up_arrow);
c.style.fontSize = actb_arrow_fSize;
c.style.fontWeight = actb_arrow_fWeight;
if (actb_self.actb_mouse)
{
c.style.cursor = 'pointer';
c.onclick = actb_mouse_up;
}
}
// Insert a down-arrown navigation row to the specified suggestTable.
function actb_add_down_arrow_row(suggestTable)
{
c = actb_add_nav_row(-1, suggestTable, actb_down_arrow);
c.style.fontSize = actb_arrow_fSize;
c.style.fontWeight = actb_arrow_fWeight;
if (actb_self.actb_mouse)
{
c.style.cursor = 'pointer';
c.onclick = actb_mouse_down;
}
}
// Insert a up-arrow placeholder row to the specified suggestTable.
function actb_add_up_arrow_placeholder(suggestTable)
{
c = actb_add_nav_row(0, suggestTable, ' ');
c.style.fontSize = actb_arrow_fSize;
c.style.fontWeight = actb_arrow_fWeight;
c.onclick = actb_placeholder_click;
}
// Insert a down-arrow placeholder row to the specified suggestTable.
function actb_add_down_arrow_placeholder(suggestTable)
{
c = actb_add_nav_row(-1, suggestTable, ' ');
c.style.fontSize = actb_arrow_fSize;
c.style.fontWeight = actb_arrow_fWeight;
c.onclick = actb_placeholder_click;
}
// Insert a navigation row with the specified HTML at
// the specified index to the specified suggesTable.
function actb_add_nav_row(index, suggestTable, strHTML)
{
r = suggestTable.insertRow(index);
r.style.backgroundColor = actb_self.actb_bgColor;
c = r.insertCell(-1);
c.style.color = actb_self.actb_textColor;
c.style.fontFamily = 'arial narrow';
c.style.fontSize = actb_self.actb_fSize;
c.align='center';
c.innerHTML = strHTML;
c.onmouseover = actb_mouse_nav_row_mouseover;
c.onmouseout = actb_mouse_nav_row_mouseout;
return c;
}
function actb_mouse_nav_row_mouseover()
{
actb_mouse_navigate = true;
}
function actb_mouse_nav_row_mouseout()
{
actb_mouse_navigate = false;
}
function actb_placeholder_click()
{
setCaret(actb_curr, actb_curr.value.length);
}
// The click event handler for the suggest table.
function actb_mouseclick(evt){
if (!evt) evt = event;
if (!actb_display) return;
actb_mouse_on_list = 0;
actb_pos = this.getAttribute('pos');
actb_penter();
// Callback is fired when selection is made by mouse.
if (mouseSelectCallback)
{
mouseSelectCallback(actb_curr);
}
}
.
.
.
return this;
}
I'm using a cf loop query to populate the array (customarray) and have run into some problems. I'm using 5 autocomplete textboxes, all with the same object (customarray), but there seems to be a limit to how many elements can be put into the array... Unless I limit my query to 1400 records I get these errors:
Expected ')'
AND
'customarray' is undefined
I also get the same errors every time I use a preceeding form to add to the WHERE criteria in the query, even when there are less elements in the array.
Thanks for any help in advance.