SitePoint Sponsor

User Tag List

Results 1 to 7 of 7
  1. #1
    SitePoint Addict michael - ohio's Avatar
    Join Date
    Dec 2004
    Location
    ohio
    Posts
    257
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    new browser window/tab onchange from form select ???

    Searched forum and couldn't find an answer - sorry to bug you, but I'd appreciate any help here...

    Web page has a form with an input field (select - dropdown) - and a javascript function to effect the field 'onchange'.
    User selects an option and the javascript function (using 'onchange') opens the selected URL in the same browser window:


    <script language="JavaScript">
    function formHandler(form){
    var URL = document.form.site.options[document.form.site.selectedIndex].value;
    window.location.href = URL;
    }
    </script>

    [...]
    <form name=form>
    <SELECT NAME="site" onChange="javascript:formHandler()">
    <OPTION VALUE=""> choose a state....
    <OPTION VALUE="http://www.ohio.com/" target="_blank">OHIO

    The "target=" is being ignored.

    How do I get this function to open the site in a new browser tab/window?

    Thank you!

    - Michael

  2. #2
    Under Construction silver trophybronze trophy AussieJohn's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, Australia
    Posts
    776
    Mentioned
    11 Post(s)
    Tagged
    0 Thread(s)
    Hey Michael.

    The reason it doesn't work is because the target attribute, for this type of use, is only effective on links.

    Try using the method `window.open()` instead of `window.location.href`. That way a new browser tab/window will be used.

    Code JavaScript:
    window.open(URL);
    Check the MDN documentation, linked to above, for more information about window.open().
    var details = {
    . . web: "afterlight.com.au",
    . . photos: "jvdl.id.au",
    . . psa: "usethelatestversion.com"
    }

  3. #3
    SitePoint Addict michael - ohio's Avatar
    Join Date
    Dec 2004
    Location
    ohio
    Posts
    257
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks John - I appreciate your pointing me in the right direction. I tried playing with the window.open() method but I can't figure out how to use that in place of what I'm using now:

    {
    var URL = document.form.site.options[document.form.site.selectedIndex].value;
    window.location.href = URL;
    }


    I tried :
    <script language="JavaScript">
    function formHandler(form){
    var URL = document.form.site.options[document.form.site.selectedIndex].value;
    window.open.href = URL;
    }
    </script>
    <SELECT NAME="site" onChange="javascript:formHandler()">


    no luck...

    I am not a coder (obviously) , and while I can usually follow syntax and make headway, javascript is all so much black-magic to me. Help?

  4. #4
    Under Construction silver trophybronze trophy AussieJohn's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, Australia
    Posts
    776
    Mentioned
    11 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by michael - ohio View Post

    window.open.href = URL;
    Hey Michael. This is an easy one to solve now - window.open() is a method - so it should be called like a function. Between window.location.href being a property (a variable inside of an object) and window.open() being a method (a function inside of an object) I can understand the confusion. Especially because they perform a relatively similar functionality.

    The solution is to use window.open() like this:

    Code javascript:
    function formHandler(form){
       var URL = document.form.site.options[document.form.site.selectedIndex].value;
       window.open(URL);
    }

    Hope this helps
    var details = {
    . . web: "afterlight.com.au",
    . . photos: "jvdl.id.au",
    . . psa: "usethelatestversion.com"
    }

  5. #5
    SitePoint Addict michael - ohio's Avatar
    Join Date
    Dec 2004
    Location
    ohio
    Posts
    257
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi John -

    Yep... that works, opening a new window each time the user selects something. THANK YOU!

    Out of curiosity, is it possible to modify
    window.open(URL);
    so that it opens to a 'named' window (so that each subsequent slection replaces the last one?

    - Michael

  6. #6
    Under Construction silver trophybronze trophy AussieJohn's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, Australia
    Posts
    776
    Mentioned
    11 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by michael - ohio View Post
    Out of curiosity, is it possible to modify
    window.open(URL);
    so that it opens to a 'named' window (so that each subsequent slection replaces the last one?
    Yeah - that's actually really easy - you can just pass a second parameter that will be the "name" of that window.

    Code:
    window.open(URL, "YourWindowName");
    (Note that you shouldn't have spaces in that string, see https://developer.mozilla.org/en-US/...OM/window.open for more info.)
    var details = {
    . . web: "afterlight.com.au",
    . . photos: "jvdl.id.au",
    . . psa: "usethelatestversion.com"
    }

  7. #7
    SitePoint Addict michael - ohio's Avatar
    Join Date
    Dec 2004
    Location
    ohio
    Posts
    257
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thank you John... your help is greatly appreciated -
    you've saved me a ton of time!

    - Michael


Tags for this Thread

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •