Dropdown option - onclick

[karimali831]

Hi,

 

When I use

<option value="http://link.com" onclick="return confirm(\'This will take you to this link\');">Link</option>

 

When I select this from the dropdown "Link", it will direct me straight to the link despite the onclick return showing.

So I select it from dropdown, shows the onclick but directs me to the page before I have a chance to click on OK or CANCEL?

[F1Fan]

Change the event from "onclick" on each option to "onchange" in the select tag. Then use "this.value" to determine the selected value. Also, this is JavaScript, not PHP, so it really should have been posted in the JS board, and you should move this to a function to have better control over it.

[karimali831]

Will you be able to show me how to use the return confirm for onchange or something that says "OK / CANCEL" on a popup when I select an option from the dropdown?

 

e.g. <option value="" onchange="return confirm('');">

[F1Fan]

Not on the <option> tag, on the <select> tag.

JS:

function goToSite(site){
if (confirm("Are you sure you want to go to "+site+"?")){
	window.location = site;
}	
}

HTML:

<select onchange="goToSite(this.value);">
<option value="http://google.com/">Google</option>
<option value="http://yahoo.com/">Yahoo</option>
</select>

[ajlisowski]

My problem with onchange is that it requires...a change of value. So the "current" selection is no longer an option for the trigger, which sort of sucks. I do not know of a good alternative or solution.

[F1Fan]

JS:

function goToSite(site){
if (site.value.length > 0){
	if (confirm("Are you sure you want to go to "+site+"?")){
		window.location = site.value;
	} else{
		site.value = "";
	}
}
}

HTML:

<select onchange="goToSite(this);">
<option value="">Select One</option>
<option value="http://google.com/">Google</option>
<option value="http://yahoo.com/">Yahoo</option>
</select>

[karimali831]

I need it for option because the onclick is different for each option you select.

[F1Fan]

I am aware of that. That's why I passed "this.value" in my first suggestion, and then passed "this" and used "this.value" in the JS function.

 

Did you try my last suggestion?