Question

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">USA
            <OPTION VALUE="http://google.ca">Canada
        </SELECT>
        <INPUT TYPE=SUBMIT VALUE="Go">
    </FORM>
</div>

Thanks in advance

Answer 1

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');