Hi,
I am trying to figure it out how to to hide in onmouseout the select options of a form. Below is the code I got so far. It isn't working.
Please help.
Thanks - <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
-
<html lang="en-US">
-
<head>
-
<title></title>
-
<script type="text/javascript" language="JavaScript">
-
function hideSelectSearchCon() {
-
var selectSearchCon = document.getElementById("catGroup").options[];
-
selectSearchCon.style.visibility = "hidden";
-
}
-
</script>
-
<head>
-
<body>
-
<form action="#" method="post">
-
<select name="catGroup" id="catGroup" onmouseout="javascript:hideSelectSearchCon();">
-
<option value="Select" selected="selected">Select</option>
-
<option value="Select_2">Select_2</option>
-
<option value="Select_3">Select_3</option>
-
<option value="Select_4">Select_4</option>
-
<option value="Select_5">Select_5</option>
-
</select>
-
-
<input type="submit"/>
-
</form>
-
</body>
-
</html>
7  4871  gits 5,390
Expert Mod 4TB
hi ...
you may play with: - function hideSelectSearchCon() {
-
var selectSearchCon = document.getElementById("catGroup");
-
selectSearchCon.blur();
-
}
-
but with that you cannot select the option with the mouse since the mouseout fires when you mouseout the select-box ... what do you really want to achieve? may be you have to combine more events but please explain in more detail what you need ...
kind regards
Thanks for your reply.
I have a top nav drop down menu, then below I have a search. If I select in the search box the select option, then I go to the drop down menu I wouldn't like to see the select option from the search box. However, now I can see the select option drop down menu from the search at the top of the top nave drop down menu.
Basically, I want to achieve that the option select from the search box behaves like the drop down menu above.
http://oaso.net/kitres/
Thanks
gits 5,390
Expert Mod 4TB
hmmm ... with the link you gave i cannot see what you mean (just get a standard page with google-search there is no dropdown?). a search with a dropdown-list? are this categories to search for? why not using the dropdown too for this purpose?
kind regards
Sorry, I didn't type the correct URL.
This is it.
http://oarso.net/kitres/
I have a top nav drop down menu, then below I have a search. If I select in the search box the select option, then I go to the drop down menu I wouldn't like to see the select option from the search box. However, now I can see the select option drop down menu from the search at the top of the top nave drop down menu.
Basically, I want to achieve that the option select from the search box behaves like the drop down menu above.
Thanks
 gits 5,390
Expert Mod 4TB
hi ...
i found a working solution for Firefox: - <script type="text/javascript">
-
-
function hideSelectSearchCon() {
-
var selectSearchCon = document.getElementById("catGroup");
-
selectSearchCon.blur();
-
}
-
-
function check_mouse_pos(e) {
-
if (typeof e == 'undefined') {
-
e = window.event;
-
}
-
-
var src = typeof window.event == 'undefined' ? e.target : e.srcElement;
-
var opt = { 'SELECT': 1, 'OPTION': 1 };
-
-
if (typeof opt[src.nodeName] == 'undefined') {
-
hideSelectSearchCon();
-
remove_event(document, check_mouse_pos);
-
}
-
}
-
-
function add_event(obj, func) {
-
if (typeof window.addEventListener != 'undefined') {
-
obj.addEventListener('mouseover', func, true);
-
} else {
-
obj.attachEvent('onmouseover', func);
-
}
-
}
-
-
function remove_event(obj, func) {
-
if (typeof window.addEventListener != 'undefined') {
-
obj.removeEventListener('mouseover', func, true);
-
} else {
-
obj.detachEvent('onmouseover', func);
-
}
-
}
-
</script>
-
-
<form action="#" method="post">
-
<select name="catGroup" id="catGroup" onclick="add_event(document, check_mouse_pos);">
-
<option value="Select" selected="selected">Select</option>
-
<option value="Select_2">Select_2</option>
-
<option value="Select_3">Select_3</option>
-
<option value="Select_4">Select_4</option>
-
<option value="Select_5">Select_5</option>
-
</select>
-
<input type="submit">
-
</form>
-
and prepared it for IE but it seems that in IE the event-handling is weird with select-elements? ... so i think the best way would be to work around it with a custom dropdown ... or may be we find a IE solution for this too?
kind regards
Thank you so much, it does work in IE7 and Firefox.
However, It doesn't work in IE6.
I am going to keep trying. Otherwise, I would do as you suggest. Use a drop down menu instead of the select option.
http://www.oarso.net/kitres/
thnx alot bro...the code that u have posted here helped me alot..
Sign in to post your reply or Sign up for a free account.
Similar topics
by: dmiller23462 |
last post by:
Hi guys....I have absolutely NO IDEA what I'm doing with Javascript
but my end result is I need two text boxes to stay hidden until a
particular option is selected....I've cobbled together the...
|
by: x muzuo |
last post by:
Hi guys,
I have got a prob of javascript form validation which just doesnt work
with my ASP code. Can any one help me out please.
Here is the code:
{////<<head>
<title>IIBO Submit Page</title>...
|
by: srampally |
last post by:
I need the capabilty to hide/show a selection list, just the way its
done at http://www.lufthansa.com (place the cursor over "Group
Companies"). However, I am looking for a javascript that is much...
|
by: David |
last post by:
Hi,
I have some database records which are listed out in a table on an asp
page.
The table is within a <formtag.
At the end of each record (and table row), I have created a <select>
dropdown...
|
by: Norman |
last post by:
Hello,
I have a working Show / Hide form, that works on FF, but what I would
like to do is to be able to display one part when a user clicks on one
radio button and display another part when the...
|
by: rickl2790 |
last post by:
Hi All
I am putting a form together and I need to be able to hide or display elements of the form based on what is selected with a select.
The form is a passenger details entry form and the...
|
by: safiratec |
last post by:
Hi,
I want to show a div depending of the value of a <select> option, using 2 functions hidediv() and showdiv() - it is working fine in firefox, but not in IE (tested with IE 6 and 7). <body...
|
by: fsalvador |
last post by:
Hi,
I need help with this. I am trying to figure it out but I can't.
I have 2 pages. I would like to display in the second page the content of one class and hide the content of the other...
|
by: dkyadav80 |
last post by:
<html>
///
here what shoud be java script for:
->when script run then not display all input text field only display selection field.
->when user select other value for institute only this...
|
by: taylorcarr |
last post by:
A Canon printer is a smart device known for being advanced, efficient, and reliable. It is designed for home, office, and hybrid workspace use and can also be used for a variety of purposes. However,...
|
by: emmanuelkatto |
last post by:
Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud.
Please let me know.
Thanks!
Emmanuel
|
by: BarryA |
last post by:
What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...
|
by: Sonnysonu |
last post by:
This is the data of csv file
1 2 3
1 2 3
1 2 3
1 2 3
2 3
2 3
3
the lengths should be different i have to store the data by column-wise with in the specific length.
suppose the i have to...
|
by: Hystou |
last post by:
There are some requirements for setting up RAID:
1. The motherboard and BIOS support RAID configuration.
2. The motherboard has 2 or more available SATA protocol SSD/HDD slots (including MSATA, M.2...
|
by: marktang |
last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However,...
|
by: Hystou |
last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can...
|
by: Oralloy |
last post by:
Hello folks,
I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>".
The problem is that using the GNU compilers,...
|
by: jinu1996 |
last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven...
| |
