Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations SkipVought on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Problem with onChange in a SELECT tag.

Status
Not open for further replies.

Albion

IS-IT--Management
Aug 8, 2000
517
0
0
US
How can I get the onChange option of a SELECT tag to execute a javascript function even if the user selects the currently selectied option?

Code:
<SELECT onChange="funct(this);">
    <OPTION SELECTED value="1">1</OPTION>
    <OPTION value="2">2</OPTION>
    <OPTION value="3">3</OPTION>
</SELECT>

I.E. I need funct(this) to execute even if the user selects "1" from the list. Right now it only runs if the selection is changed to "2" or "3".

-Craig
 
Short answer is you can't. Its called onChange because it only fires when the value "changes".

You can either add a blank value to the select box to force an actual selection, or maybe use another event such as onmousedown, onmouseup, onClick etc.. to run the script whenever the mouse button is clicked, or pressed. However this my cause problems, as the value of the select box may not get set before the script is run.

For further JS questions you may want to ask in forum216









----------------------------------
Phil AKA Vacunita
----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.
 
I apologize, sometimes the HTML and javascript gets so intertwined I don't know where to ask. This question dealt with the onChange option of a SELECT HTML tag so I figured it should go here.

Thanks for the response.
 
Code:
<body onLoad="funct(this);">
should do it w/o further change.
 
dkdude said:
Code:
<body onLoad="funct(this);">

should do it w/o further change.
No, that will run it when the page loads, how is that helpful?



----------------------------------
Phil AKA Vacunita
----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.
 

Very True feherke. Missed that part.


----------------------------------
Phil AKA Vacunita
----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.
 
If I read Albion's question correct, he needs to fetch the selected index to do some "whatever-he-needs-to-do-function"; and this will accomplish just that:
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "[URL unfurl="true"]http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">[/URL]
<html xmlns="[URL unfurl="true"]http://www.w3.org/1999/xhtml">[/URL]

<head>
  <title>...</title>
</head>

<body onLoad="funct(this)">

  <script type="text/javascript">

    function funct(obj) {

     /***************************************************
      *   Just for testing indexes and selected values  *
      *   Replace with code of your desire and purpose  *
      ***************************************************/

      var optionID = document.getElementById('myDropDown');
      var optionIndex = optionID.selectedIndex;
      var optionValue = optionID.options[optionIndex].value;

      alert('Current option selected is '+optionValue);
    }

  </script>

  <select onChange="funct(this)" id="myDropDown">
      <option selected value="1">1</option>
      <option value="2">2</option>
      <option value="3">3</option>
  </select>

</body>
</html>

... right?
 
... I should add -the desired function as called by a [tt]onChange[/tt]-event will be fired, but initially as a [tt]onLoad[/tt]-event, hence not requiring "initial" change state to fire the desired event-funtion. But as long as it's the same function, it will yield the same result ... (without initial change-state).

Albion, did I read your question correct or ... ?
 
-and vacunita, you are right, we should be discussing this topic in the JavaScript forum ;-) Just couldn't help it :-D
 
dkdude,

I haven't tested it yet, but I follow the logic.

In other words when the page loads it fires the event for the initial selection, thus making the changes on the page I desire. That way if a users re-selects the default option the desired effect has already happened leaving no need to select it in the first place. I think the only reason this might not work is when the author has a default effect on a page which does not match the effect of the defaultly selected option. In my situation, that's not the case, so we'll see.

Thanks for the example.

-Al
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top