Go Back   CodingForums.com > :: Client side development > JavaScript programming

Before you post, read our: Rules & Posting Guidelines

Reply
 
Thread Tools Rate Thread
Enjoy an ad free experience by logging in. Not a member yet? Register.
Old 10-04-2011, 10:19 PM   PM User | #1
sherlockturtle
Regular Coder

 
Join Date: May 2011
Posts: 357
Thanks: 23
Thanked 1 Time in 1 Post
sherlockturtle can only hope to improve
<select>

Code:
<select name="selectme" onChange=""> 
<option value="layer1name">1</option> 
<option value="layer2name">2</option> 
<option value="layer3name">3</option> 
</select>
how can you make a onclick for this to work. So if you cliked the seconde one it would change somthing(i dont care what).
sherlockturtle is offline   Reply With Quote
Old 10-05-2011, 12:28 AM   PM User | #2
Old Pedant
Supreme Master coder!

 
Old Pedant's Avatar
 
Join Date: Feb 2009
Posts: 23,248
Thanks: 59
Thanked 3,998 Times in 3,967 Posts
Old Pedant is a name known to allOld Pedant is a name known to allOld Pedant is a name known to allOld Pedant is a name known to allOld Pedant is a name known to allOld Pedant is a name known to all
You mean that if the user clicks the second one when it is already selected you still want something to happen? That is, even if no change occurs?
__________________
An optimist sees the glass as half full.
A pessimist sees the glass as half empty.
A realist drinks it no matter how much there is.
Old Pedant is offline   Reply With Quote
Old 10-05-2011, 03:03 AM   PM User | #3
sherlockturtle
Regular Coder

 
Join Date: May 2011
Posts: 357
Thanks: 23
Thanked 1 Time in 1 Post
sherlockturtle can only hope to improve
Quote:
Originally Posted by Old Pedant View Post
You mean that if the user clicks the second one when it is already selected you still want something to happen? That is, even if no change occurs?
Ya anytime you click on it, so its like a button.
sherlockturtle is offline   Reply With Quote
Old 10-05-2011, 04:28 AM   PM User | #4
Old Pedant
Supreme Master coder!

 
Old Pedant's Avatar
 
Join Date: Feb 2009
Posts: 23,248
Thanks: 59
Thanked 3,998 Times in 3,967 Posts
Old Pedant is a name known to allOld Pedant is a name known to allOld Pedant is a name known to allOld Pedant is a name known to allOld Pedant is a name known to allOld Pedant is a name known to all
Well, I think you can attach onclick to each of the <option>s in *SOME* browsers.

Code:
<form>
<select>
<option onclick="this.form.x.value=1"> ONE </option>
<option onclick="this.form.x.value=2"> TWO </option>
<option onclick="this.form.x.value=3"> THREE </option>
</select>
<input name="x">
</form>
I just tried that, and it only worked in FF. Not in MSIE or Chrome.

I can think of a couple of hacks, but not sure any of them would work in all browsers.
__________________
An optimist sees the glass as half full.
A pessimist sees the glass as half empty.
A realist drinks it no matter how much there is.
Old Pedant is offline   Reply With Quote
Old 10-05-2011, 08:16 AM   PM User | #5
jassi.singh
Regular Coder

 
Join Date: Sep 2011
Posts: 103
Thanks: 0
Thanked 14 Times in 14 Posts
jassi.singh can only hope to improve
Hi,

Try to implement onchange event.
jassi.singh is offline   Reply With Quote
Old 10-05-2011, 01:15 PM   PM User | #6
sherlockturtle
Regular Coder

 
Join Date: May 2011
Posts: 357
Thanks: 23
Thanked 1 Time in 1 Post
sherlockturtle can only hope to improve
Quote:
Originally Posted by jassi.singh View Post
Hi,

Try to implement onchange event.
I tried but when i would change to any of the selections it would do the function.
sherlockturtle is offline   Reply With Quote
Old 10-05-2011, 01:48 PM   PM User | #7
Philip M
Supreme Master coder!

 
Philip M's Avatar
 
Join Date: Jun 2002
Location: London, England
Posts: 17,044
Thanks: 197
Thanked 2,412 Times in 2,390 Posts
Philip M has a spectacular aura aboutPhilip M has a spectacular aura aboutPhilip M has a spectacular aura about
You are misunderstanding the nature of a select list. You cannot use onclick with an option in IE. Why do you not use radio buttons with onclick? Then every time you click on a button the function is triggered.
__________________

All the code given in this post has been tested and is intended to address the question asked.
Unless stated otherwise it is not just a demonstration.
Philip M is offline   Reply With Quote
Old 10-05-2011, 07:47 PM   PM User | #8
Old Pedant
Supreme Master coder!

 
Old Pedant's Avatar
 
Join Date: Feb 2009
Posts: 23,248
Thanks: 59
Thanked 3,998 Times in 3,967 Posts
Old Pedant is a name known to allOld Pedant is a name known to allOld Pedant is a name known to allOld Pedant is a name known to allOld Pedant is a name known to allOld Pedant is a name known to all
** I GOT IT **
Code:
<form>
<select onfocus="this.selectedIndex=0;" 
        onchange="v=this.selectedIndex;this.form.x.value=this.value;"
        onblur="this.selectedIndex=v;">
<option>--choose--</option>
<option value="one"> one </option>
<option value="two"> two </option>
<option value="shoe"> shoe </option>
</select>
<input name="x">
</form>
Go ahead: Click on one of the values in the <select>. It copies its value to the <input>. Now change what is in the <input>. Now go back to the <select> and click on the *SAME OPTION*. It again copies its value to the <input>.

See the tricK? As soon as the <select> receives focus, it RESETS the selected option! So now, the onchange indeed works to trigger the copy of the value to the <input>. And then the onblur ensures that, as you leave the <select>, the option you chose is still displayed.

By combining all three, it worked the same in MSIE, FireFox, and Chrome.
__________________
An optimist sees the glass as half full.
A pessimist sees the glass as half empty.
A realist drinks it no matter how much there is.
Old Pedant is offline   Reply With Quote
Old 10-08-2011, 01:58 PM   PM User | #9
jassi.singh
Regular Coder

 
Join Date: Sep 2011
Posts: 103
Thanks: 0
Thanked 14 Times in 14 Posts
jassi.singh can only hope to improve
Quote:
Originally Posted by sherlockturtle View Post
I tried but when i would change to any of the selections it would do the function.
Hi,

you can call javascript function on change event of select element as shown below.

<SELECT NAME="selState" SIZE="1" ONCHANGE="HandleChange();">
<OPTION VALUE="IL">Illinois</OPTION>
<OPTION VALUE="MO">Missouri</OPTION>
<OPTION VALUE="HA">Hawaii</OPTION>
<OPTION VALUE="NY">New York</OPTION>

In handleChange() function you can acess the value

function HandleChange() {

// based on the selected value you can perform your action following is
//the line which will get you selected value from the list box.
// you can write case statement for each value.
alert(document.forms.selState.value);
}

http://www.4guysfromrolla.com/webtech/101398-1.shtml
jassi.singh is offline   Reply With Quote
Reply

Bookmarks

Jump To Top of Thread


Thread Tools
Rate This Thread
Rate This Thread:

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT +1. The time now is 11:24 AM.


Advertisement
Log in to turn off these ads.