Title: Drop-Down Link Opens Inside Drop-Down List
Last modified: August 30, 2016

---

# Drop-Down Link Opens Inside Drop-Down List

 *  Resolved [NiallASD](https://wordpress.org/support/users/niallasd/)
 * (@niallasd)
 * [10 years, 8 months ago](https://wordpress.org/support/topic/drop-down-link-opens-inside-drop-down-list/)
 * Hi all,
 * I’ll start by saying I’m guessing this is because I’m using an iFrame, but I 
   don’t know what other method I should be using.
 * On [my page](http://greencastleparish.com/wordpress/news-sheet-archive/) I have
   a drop-down list that shows an archive – clicking on an entry on this list is
   meant to take you to a separate page (in the same window), but instead it loads
   the new page within the drop-down list itself.
 * I don’t want to include the form code on every page as that would mean a lot 
   of extra work every 3 months so I included it in a separate PHP file.
 * Here’s the code:
 * `<iframe src="http://www.greencastleparish.com/wordpress/wp-content/themes/greencastleparish/
   newssheetarchive.php" style="border: 0px #FFF none; float: right; clear: both;"
   name="newssheetarchive" scrolling="no" frameborder="1" marginheight="0px" marginwidth
   ="0px" height="20px" width="213px"></iframe>`
 * And this is in it’s own separate PHP file (I removed some of the entries here
   for the sake of readability):
 *     ```
       <script>
       <!--
       function JumpToIt(list) {
           var newPage = list.options[list.selectedIndex].value
           if (newPage != "None") {
               location=newPage
           }
       }
       //-->
       </script> <!-- archive list -->
   
       <div class="monthlist">
       <form>
         <select name="select" onchange="JumpToIt(this)">
           <option value="None">Select a month from the archive</option>
           <option value="http://www.greencastleparish.com/wordpress/native-priests">April to June, 2015</option>
           <option value="http://www.nialldevlin.com/newssheetarchive/2015/january-march.php">January to March, 2015</option>
           <option value="http://www.nialldevlin.com/newssheetarchive/2014/october-december.php">October to December, 2014</option>
         </select>
       </form>
       </div> <!-- monthlist -->
       ```
   
 * [Once again, here is the page.](http://greencastleparish.com/wordpress/news-sheet-archive/)
 * [And here is the PHP file](http://www.greencastleparish.com/wordpress/wp-content/themes/greencastleparish/newssheetarchive.php),
   incidentally it works fine straight from here.
 * **Really hope someone can help me with this as it’s been puzzling me for a long
   while.**

Viewing 15 replies - 1 through 15 (of 27 total)

1 [2](https://wordpress.org/support/topic/drop-down-link-opens-inside-drop-down-list/page/2/?output_format=md)
[→](https://wordpress.org/support/topic/drop-down-link-opens-inside-drop-down-list/page/2/?output_format=md)

 *  [Andrew Nevins](https://wordpress.org/support/users/anevins/)
 * (@anevins)
 * WCLDN 2018 Contributor | Volunteer support
 * [10 years, 8 months ago](https://wordpress.org/support/topic/drop-down-link-opens-inside-drop-down-list/#post-6493034)
 * Hmm have you disabled the vertical scrolling on your site? Where is this dropdown?
 *  [Hassan Akhtar](https://wordpress.org/support/users/khaxan/)
 * (@khaxan)
 * [10 years, 8 months ago](https://wordpress.org/support/topic/drop-down-link-opens-inside-drop-down-list/#post-6493070)
 * I don’t see why an iframe is needed. Can’t you include the file somewhere inside
   your WP theme like this:
 * <?php include ‘newssheetarchive.php’; ?>
 * Better yet, use [a WordPress function](https://codex.wordpress.org/Function_Reference/get_template_part).
 *  Thread Starter [NiallASD](https://wordpress.org/support/users/niallasd/)
 * (@niallasd)
 * [10 years, 8 months ago](https://wordpress.org/support/topic/drop-down-link-opens-inside-drop-down-list/#post-6493128)
 * Thanks for the replies Andrew and WP Gurus.
 * Sorry I haven’t replied in so long, but it didn’t seem like my post went through
   so I thought I’d try again later (now).
 * I haven’t disabled vertical scrolling, but I am using a plugin that replaces 
   the scroll bar with something I find less intrusive.
 * The drop-down is directly below the ‘Download Adobe Reader’ button.
 * Whenever I use `<?php --- ?>` the drop-down disappears altogether.
 *  Thread Starter [NiallASD](https://wordpress.org/support/users/niallasd/)
 * (@niallasd)
 * [10 years, 8 months ago](https://wordpress.org/support/topic/drop-down-link-opens-inside-drop-down-list/#post-6493210)
 * I hope it’s OK to move this post to the top of the forum, my reason being that
   I’m in the UK and not many people may have been active when I made the last post
   10 hours ago.
 *  [Andrew Nevins](https://wordpress.org/support/users/anevins/)
 * (@anevins)
 * WCLDN 2018 Contributor | Volunteer support
 * [10 years, 8 months ago](https://wordpress.org/support/topic/drop-down-link-opens-inside-drop-down-list/#post-6493236)
 * If you’re losing money from this then you need to consider hiring someone for
   support, because threads are known to go unanswered for months.
 * _[Comment redacted]_
 *  [Andrew Nevins](https://wordpress.org/support/users/anevins/)
 * (@anevins)
 * WCLDN 2018 Contributor | Volunteer support
 * [10 years, 8 months ago](https://wordpress.org/support/topic/drop-down-link-opens-inside-drop-down-list/#post-6493237)
 * Wait I’ve probably misunderstood the issue!
 *  [Andrew Nevins](https://wordpress.org/support/users/anevins/)
 * (@anevins)
 * WCLDN 2018 Contributor | Volunteer support
 * [10 years, 8 months ago](https://wordpress.org/support/topic/drop-down-link-opens-inside-drop-down-list/#post-6493238)
 * So, “location” is the Window object? If so, then you’ll probably guess that the
   Window object is local to the iFrame. That would explain the issue.
 *  Thread Starter [NiallASD](https://wordpress.org/support/users/niallasd/)
 * (@niallasd)
 * [10 years, 8 months ago](https://wordpress.org/support/topic/drop-down-link-opens-inside-drop-down-list/#post-6493251)
 * Not losing money, but wanted to try my luck here first before resorting to hiring
   someone.
 * I can kind of see what you are saying about “location” being the issue, but I
   don’t know how to fix it. Is it a matter of changing the following JavaScript?
 *     ```
       <script>
       <!--
       function JumpToIt(list) {
           var newPage = list.options[list.selectedIndex].value
           if (newPage != "None") {
               location=newPage
           }
       }
       //-->
       </script> <!-- archive list -->
       ```
   
 * I have the same drop-down list working fine on [this site](http://www.nialldevlin.com/newssheetarchive.php),
   albeit the following differences:
 * > Not created in WordPress, but as .php pages with a `<?php include (` to the
   form
    > JavaScript on the same page as the `<?php include (`
 * Thanks again Andrew.
 * Hope I’m not butchering any terminology.
 *  [Andrew Nevins](https://wordpress.org/support/users/anevins/)
 * (@anevins)
 * WCLDN 2018 Contributor | Volunteer support
 * [10 years, 8 months ago](https://wordpress.org/support/topic/drop-down-link-opens-inside-drop-down-list/#post-6493253)
 * You can’t fix it because it’s not a bug, it’s a limitation of using an iFrame.
   Everything inside of an iFrame is local. You can try your best to hack it by 
   calling the parent window object, or not use an iFrame.
 *  [Andrew Nevins](https://wordpress.org/support/users/anevins/)
 * (@anevins)
 * WCLDN 2018 Contributor | Volunteer support
 * [10 years, 8 months ago](https://wordpress.org/support/topic/drop-down-link-opens-inside-drop-down-list/#post-6493254)
 * [http://stackoverflow.com/questions/2161388/calling-a-parent-window-function-from-an-iframe](http://stackoverflow.com/questions/2161388/calling-a-parent-window-function-from-an-iframe)
 *  [Andrew Nevins](https://wordpress.org/support/users/anevins/)
 * (@anevins)
 * WCLDN 2018 Contributor | Volunteer support
 * [10 years, 8 months ago](https://wordpress.org/support/topic/drop-down-link-opens-inside-drop-down-list/#post-6493255)
 * > I have the same drop-down list working fine on this site, albeit the following
   > differences:
   > > Not created in WordPress, but as .php pages with a <?php include ( to the
   > form
   >  > JavaScript on the same page as the <?php include (
 * The real differences are:
    - Not pulled in using an iFrame
 *  [Andrew Nevins](https://wordpress.org/support/users/anevins/)
 * (@anevins)
 * WCLDN 2018 Contributor | Volunteer support
 * [10 years, 8 months ago](https://wordpress.org/support/topic/drop-down-link-opens-inside-drop-down-list/#post-6493257)
 * If you follow that stackoverflow example, it will require some this JS to be 
   added on your page and not just your iFrame:
 *     ```
       function JumpToIt(list) {
           var newPage = list.options[list.selectedIndex].value
           if (newPage != "None") {
               location=newPage
           }
       }
       ```
   
 * _[https://wordpress.org/plugins/tc-custom-javascript/](https://wordpress.org/plugins/tc-custom-javascript/)_
 *  Thread Starter [NiallASD](https://wordpress.org/support/users/niallasd/)
 * (@niallasd)
 * [10 years, 8 months ago](https://wordpress.org/support/topic/drop-down-link-opens-inside-drop-down-list/#post-6493280)
 * I’ve tried following your instructions like so, but I guess I messed up somewhere
   along the way.
 * I installed and activated the TC Custom JavaScript plugin and adding the code
   below.
 *     ```
       function JumpToIt(list) {
           var newPage = list.options[list.selectedIndex].value
           if (newPage != "None") {
               location=newPage
           }
       }
       ```
   
 * Along with this for the newssheetarchive.php page.
 *     ```
       <script>
       <!--
       function JumpToIt(list) {
           var newPage = list.options[list.selectedIndex].value
           if (newPage != "None") {
               location=newPage
           }
       }
       //-->
       </script> <!-- archive list -->
   
       <div class="monthlist">
       <form>
         <select name="select" onchange="JumpToIt(this)">
           <option value="None">Select a month from the archive</option>
           <option onclick="parent.newPage;" value="http://www.greencastleparish.com/wordpress/native-priests">April to June, 2015</option>
         </select>
       </form>
       </div> <!-- monthlist -->
       ```
   
 * And this on the WordPress page.
 * `<iframe src="http://www.greencastleparish.com/wordpress/wp-content/themes/greencastleparish/
   newssheetarchive.php" style="border: 0px #FFF none; float: right; clear: both;"
   name="newssheetarchive" scrolling="no" frameborder="1" marginheight="0px" marginwidth
   ="0px" height="20px" width="213px"></iframe>`
 * I still get the same iFrame problem, I understand it’s because it’s an iframe
   that this is happening but everything else I’ve used causes the drop-down list
   to disappear entirely.
 * I also tried [this plugin](https://wordpress.org/plugins/css-javascript-toolbox/)
   as an alternative to TC Custom JavaScript, but with no luck.
 * Thanks for the helping hand along the way.
 *  Thread Starter [NiallASD](https://wordpress.org/support/users/niallasd/)
 * (@niallasd)
 * [10 years, 8 months ago](https://wordpress.org/support/topic/drop-down-link-opens-inside-drop-down-list/#post-6493281)
 * I’ve tried posting a reply here, but it doesn’t seem to be going through – sorry
   if it has multiple times.
 *  [Andrew Nevins](https://wordpress.org/support/users/anevins/)
 * (@anevins)
 * WCLDN 2018 Contributor | Volunteer support
 * [10 years, 8 months ago](https://wordpress.org/support/topic/drop-down-link-opens-inside-drop-down-list/#post-6493284)
 * There must be something wrong with the JS plugin you’re using, because it’s not
   loading JS in the right place. It’s just spitting it out onto the page straight
   after the `<body>` tag.
 * Also, the Stackoverflow example shows that you need to call the parent window.
   So this:
 *     ```
       <div class="monthlist">
       <form>
         <select name="select" onchange="JumpToIt(this)">
           <option value="None">Select a month from the archive</option>
           <option onclick="parent.newPage;" value="http://www.greencastleparish.com/wordpress/native-priests">April to June, 2015</option>
         </select>
       </form>
       </div> <!-- monthlist -->
       ```
   
 * Will have to be this:
 *     ```
       <div class="monthlist">
       <form>
         <select name="select" onchange="parent.JumpToIt(this)">
           <option value="None">Select a month from the archive</option>
           <option onclick="parent.newPage;" value="http://www.greencastleparish.com/wordpress/native-priests">April to June, 2015</option>
         </select>
       </form>
       </div> <!-- monthlist -->
       ```
   

Viewing 15 replies - 1 through 15 (of 27 total)

1 [2](https://wordpress.org/support/topic/drop-down-link-opens-inside-drop-down-list/page/2/?output_format=md)
[→](https://wordpress.org/support/topic/drop-down-link-opens-inside-drop-down-list/page/2/?output_format=md)

The topic ‘Drop-Down Link Opens Inside Drop-Down List’ is closed to new replies.

## Tags

 * [down](https://wordpress.org/support/topic-tag/down/)
 * [iframe](https://wordpress.org/support/topic-tag/iframe/)
 * [javascript](https://wordpress.org/support/topic-tag/javascript/)
 * [link](https://wordpress.org/support/topic-tag/link/)
 * [list](https://wordpress.org/support/topic-tag/list/)
 * [php](https://wordpress.org/support/topic-tag/php/)

 * In: [Fixing WordPress](https://wordpress.org/support/forum/how-to-and-troubleshooting/)
 * 27 replies
 * 3 participants
 * Last reply from: [NiallASD](https://wordpress.org/support/users/niallasd/)
 * Last activity: [10 years, 8 months ago](https://wordpress.org/support/topic/drop-down-link-opens-inside-drop-down-list/page/2/#post-6493328)
 * Status: resolved

## Topics

### Topics with no replies

### Non-support topics

### Resolved topics

### Unresolved topics

### All topics