views:

1304

answers:

1

I have a dropdown selector in place and I need to change it so that the target="_blank" so it opens up a new tab.

Here is the current code:

<SCRIPT TYPE="text/javascript">
<!--
function dropdown(mySel)
{
var myWin, myVal;
myVal = mySel.options[mySel.selectedIndex].value;
if(myVal)
   {
   if(mySel.form.target)myWin = parent[mySel.form.target];
   else myWin = window;
   if (! myWin) return true;
   myWin.location = myVal;
   }
return false;
}
//-->
</SCRIPT>

<div id=countryselector>
    <FORM
        ACTION="../cgi-bin/redirect.pl"
        METHOD=POST onSubmit="return dropdown(this.gourl)">
        <SELECT NAME="gourl">
            <OPTION VALUE="">Select a Country...
            <OPTION VALUE="http://google.com"&gt;USA
            <OPTION VALUE="http://google.ca"&gt;Canada
        </SELECT>
        <INPUT TYPE=SUBMIT VALUE="Go">
    </FORM>
</div>

Thanks in advance

+1  A: 
function dropdown(mySel) {
    var myVal = mySel.options[mySel.selectedIndex].value;
    if (myVal) {
        if (mySel.form.target) {
            window.open(myVal, mySel.form.target, '_attributes_');
        } else {
            window.location.href = myVal;
        }
    }
    return false;
}

A list of _attributes_ can be found here for Mozilla or here for IE. There are a few differences in some of the options available, so it is best to review both lists.

You can also leave the third parameter off the function call and it should behave like target="_blank" on your <form>:

// behaves as if you submitted <form ... target="_blank">:
window.open(myVal, mySel.form.target);

Here is an example using a set of _attributes_ as documented at the links provided to open a window of a specific size and position with specific parts of the UI suppressed:

// this opens a window that is 400 pixels by 300 pixels
// it is positioned 100 pixels from the top and the left
// it will have no statusbar, no menu but the new window will have a toolbar:
window.open(myVal, mySel.form.target,
    'height=300,width=400,top=100,left=100,statusbar=0,menu=0,toolbar=1');
Grant Wagner
I can't get it to work...Is it supposed to look like this:function dropdown(mySel) { var myVal = mySel.options[mySel.selectedIndex].value; if (myVal) { if (mySel.form.target) { window.open(myVal, mySel.form.target, 'target="_blank"'); } else { window.location.href = myVal; } } return false;}
BassKozz
@BassKozz: No. `_attributes_` are things like `'statusbar=0,menu=0,top=10,left=10'` (no status bar on the new window, no menu, position the new window 10 pixels from the top and from the left).
Grant Wagner
Not working... window.open(myVal, mySel.form.target);Still opening the link in the same window.
BassKozz
@BassKozz: Your JavaScript, as provided in the original question, will *only* open a new window if the `<form>` has a `target` attribute on it. The code I supplied does the same thing. It tests `mySel.form.target` to see if it is a non-blank, non-null string. If it is, then the JavaScript opens the target in a new window. To make the JavaScript work, your **HTML** needs to contain `<form ... target="something">` (obviously the `...` part is your other attributes - `method`, `action`, etc).
Grant Wagner
Got it so I needed to use: <FORM ACTION="../cgi-bin/redirect.pl" METHOD=POST onSubmit="return dropdown(this.gourl)" TARGET="_blank">Thanks
BassKozz