/    Sign up×
Community /Pin to ProfileBookmark

Inline new window command for drop down FORM

Copy linkTweet thisAlerts:
Jan 24.2007

sighhhh. i need some help. I’m making a clickthrough help guide for do-it-yourself technicians and I would very much like to have a drop down box that links to other webpages. All good. I can handle a simple code like that, but when trying to make those links open a new window I have a bit of trouble. The standard inline target=”name” command doesn’t work on the drop down box. Here’s a sample of what I’m talking about.

[CODE]
<FORM NAME=”Box1″>
<SELECT NAME=”Links1″>
<OPTION SELECTED>Choose.
<OPTION VALUE=”http://www.google.com” TARGET=”newgooglewindow”>Google!
<OPTION VALUE=”http://www.yahoo.com” TARGET=”newyahoowindow”>Yahoo!
</SELECT>
<INPUT TYPE=”BUTTON” VALUE=”Go.” onClick=”LinkUp()”>
</FORM>
[/CODE]

Anyone got any ideas on other commands besides TARGET or is there a javascript to work around this? I appreciate your replies.

to post a comment
HTML

5 Comments(s) ↴

Copy linkTweet thisAlerts:
@ray326Jan 24.2007 — [code=html]
<FORM NAME="Box1">
<select name="Links1" onchange="window.open(this.value)">
<OPTION SELECTED>Choose.
<OPTION VALUE="http://www.google.com">Google!</option>
<OPTION VALUE="http://www.yahoo.com">Yahoo!</option>
</SELECT>
</FORM>
[/code]
Copy linkTweet thisAlerts:
@connermcdauthorJan 24.2007 — thank you
Copy linkTweet thisAlerts:
@connermcdauthorJan 24.2007 — ok so take out the button, but there still leaves a problem. My option selected choose when changed opens a blank window. any way to negate that?
Copy linkTweet thisAlerts:
@ray326Jan 25.2007 — It creates a "new window". The title of this thread says "new window". The use of the target as stated will produce a "new window." ?
Copy linkTweet thisAlerts:
@connermcdauthorJan 25.2007 — here i figured it out.... here's the code if you're interested. your way is included but there's also three other options.

[CODE]
<html>
<head>
<script type="text/javascript">
// this function is only used in ex #1
function LinkUp()
{
var opt = document.getElementById('Links1');
if (opt.value != '') window.open('http://' + opt.value + '/');
}

// this function is only used in ex #4
window.onload = function()
{
document.getElementById('Links4').onclick = function()
{
var opt = document.getElementById('Links3');
if (opt.value != '') window.open('http://' + opt.value + '/');
};
};

</script>
</head>

<body>

ex1: Calling external function.
<br/>
<SELECT id="Links1">
<OPTION value="" SELECTED>Choose</option>
<OPTION VALUE="www.yahoo.com"> Yahoo </option>
<OPTION VALUE="www.yahoo.com"> Yahoo </option>
<OPTION VALUE="www.yahoo.com"> Yahoo </option>
</SELECT>
<INPUT TYPE="BUTTON" VALUE="Proceed." onClick="javascript:LinkUp();">
<br/>
<br/>

ex2: Using inline script.
<br/>
<select id="Links2">
<OPTION value="" SELECTED>Choose</option>
<OPTION VALUE="www.yahoo.com"> Yahoo </option>
<OPTION VALUE="www.yahoo.com"> Yahoo </option>
<OPTION VALUE="www.yahoo.com"> Yahoo </option>
</select>
<INPUT TYPE="BUTTON" VALUE="Proceed." onClick="javascript:var opt = document.getElementById('Links2'); if (opt.value != '') window.open('http://' + opt.value + '/');">
<br/>
<br/>

ex3: Using inline script in the onchange() event.
<br/>
<select onchange="javascript:if (this.value != '') window.open('http://'+this.value+'/');">
<OPTION value="" SELECTED>Choose</option>
<OPTION VALUE="www.yahoo.com"> Yahoo </option>
<OPTION VALUE="www.yahoo.com"> Yahoo </option>
<OPTION VALUE="www.yahoo.com"> Yahoo </option>
</select>
<br/>
<br/>

ex4: Using script externally bound to the element.
<br/>
<SELECT id="Links3">
<OPTION value="" SELECTED>Choose</option>
<OPTION VALUE="www.yahoo.com"> Yahoo </option>
<OPTION VALUE="www.yahoo.com"> Yahoo </option>
<OPTION VALUE="www.yahoo.com"> Yahoo </option>
</SELECT>
<INPUT TYPE="BUTTON" VALUE="Proceed." id="Links4">
</body>
</html>
[/CODE]
×

Success!

Help @connermcd spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 5.19,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...