#1
  1. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Mar 2013
    Posts
    5
    Rep Power
    0

    Exclamation New popup window inside script


    I have a script which consists of a interlocked double drop down menu.
    The menu displays links to a new html page.

    I want the menu to open the new webpage in the existing window or a new window.

    Plz advise how to do this.

    Script - pastebin.com/Aj4SSUpa
  2. #2
  3. A Not To Shabby Code Smurf
    Devshed Beginner (1000 - 1499 posts)

    Join Date
    Aug 2008
    Posts
    1,110
    Rep Power
    119
    I created a function and added it to your links; to do what your wanting to do. It has two parameters; one needs to either be set to "blank" (to open link in new window) or it needs to be set to "parent" (to open link in current window). You do not need to change the second parameter; as it needs to always be set to "this", because that refers to the current link element. Anyway, here is the "revised" code:
    Code:
    <center><table bgcolor="f4e7c3" border="0" cellpadding="10" cellspacing="0" style="width: 100%px;"><tbody>
    <tr><td align="center" valign="MIDDLE" width="25%"><span style="color: #04384d; font-family: Trebuchet MS, sans-serif; font-size: large;">Select from the drop-down below</span><br /><br /><!-- The first select list -->
    Select Chapter: <select name="slist1" onchange="SList.getSelect('slist2', this.value);">
     <option />- - -
     <option value="ch1" />Chapter 1
     <option value="ch2" />Chapter 2
    </select>
    <!-- Tags for the seccond dropdown list, and for text-content -->
    <span id="slist2"></span> <div id="scontent"></div>
    
    <script>
    
    function neWin(typeOfWin,ele)
    {
     if (typeOfWin=="blank") {
      window.open(ele.href);
     }
     else if (typeOfWin=="parent") {
      document.location.href = ele.href;
     }
    }
    
    <!--
    /* Script Double Select Dropdown List, from: coursesweb.net/javascript/ */
    var SList = new Object();             // JS object that stores data for options
    
    // HERE replace the value with the text you want to be displayed near Select
    var txtsl2 = 'Select Verse:';
    
    /*
     Property with options for the Seccond select list
     The key in this object must be the same with the values of the options added in the first select
     The values in the array associated to each key represent options of the seccond select
    */
    SList.slist2 = {
     "ch1": ['Ch1-Verse1', 'Ch1-Verse2'],
    "ch2": ['Ch2-Verse1',  'Ch2-Verse2']
    };
    
    /*
     Property with text-content associated with the options of the 2nd select list
     The key in this object must be the same with the values (options) added in each Array in "slist2" above
     The values of each key represent the content displayed after the user selects an option in 2nd dropdown list
    */
    SList.scontent = {
    "Ch1-Verse1": '<a href=\'http://test.com/chapter-1-verse-1.html\' onclick=\'neWin(\"blank\",this);return false\'>Chapter 1 - Verse 1</a>',
    "Ch1-Verse2": '<a href=\'http://test.com/chapter-1-verse-2.html\' onclick=\'neWin(\"blank\",this);return false\'>Chapter 1 - Verse 2</a>',
    "Ch2-Verse1": '<a href=\'http://test.com/chapter-2-verse-1.html\' onclick=\'neWin(\"blank\",this);return false\'>Chapter 2 - Verse 1</a>',
    "Ch2-Verse2": '<a href=\'http://test,com/chapter-2-verse-2.html\' onclick=\'neWin(\"blank\",this);return false\'>Chapter 2 - Verse 2</a>'
    };
    
        /* From here no need to modify */
    
    // function to get the dropdown list, or content
    SList.getSelect = function(slist, option) {
      document.getElementById('scontent').innerHTML = '';           // empty option-content
    
      if(SList[slist][option]) {
        // if option from the last Select, add text-content, else, set dropdown list
        if(slist == 'scontent') document.getElementById('scontent').innerHTML = SList[slist][option];
        else if(slist == 'slist2') {
          var addata = '<option>- - -</option>';
          for(var i=0; i<SList[slist][option].length; i++) {
            addata += '<option value="'+SList[slist][option][i]+'">'+SList[slist][option][i]+'</option>';
          }
    
          document.getElementById('slist2').innerHTML = txtsl2+' <select name="slist2" onchange="SList.getSelect(\'scontent\', this.value);">'+addata+'</select>';
          document.getElementById('slist2').href = txtsl2+' <select name="slist2" onchange="SList.getSelect(\'scontent\', this.value);">'+addata+'</select>';
          document.getElementById('slist2').href = target="_blank";
        }
      }
      else if(slist == 'slist2') {
        // empty the tag for 2nd select list
        document.getElementById('slist2').innerHTML = '';
      }
    }
    --></script>
    </td></tr></tbody></table></center>

IMN logo majestic logo threadwatch logo seochat tools logo