Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    New Coder
    Join Date
    Jul 2009
    Posts
    22
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Getting the selected value from a drop down populated by an external JavaScript file

    Hi I have a drop down which is populated by an external JavaScript file. The drop down doesn't have any <option> tags within its <Select> tags and all the items are entered into a config.js file. I need to add the item selected by the user from this Drop Down to a hidden field. I can find example on how to do this with a drop down that has been populated by inline JavaScript, bu none so far by an external script. One other thing I am using a chained menu script with three drop downs. Is there any way I could do this all the relevant info from files are below.

    Thanks in advance

    Lee

    booking-form.asp (relevant code contains the drop downs)
    Code:
    <body onload="initListGroup('chainedmenu', document.contactform.coursetype, document.contactform.course, document.contactform.coursedate,  'savestate' )">
    
    
    <select name="coursetype" id="coursetype"  class="formStyle" style="width:335px;" >
    
    <select name="course" class="formStyle" style="width:425px;" >
    <select name="coursedate" class="formStyle" style="width:300px;" ></select>   
    
    -- chainedmenu.js --

    Code:
    // Chained Menu
    
    // Copyright Xin Yang 2004
    // Web Site: www.yxScripts.com
    // EMail: m_yangxin@hotmail.com
    // Last Updated: 2004-08-23
    
    // This script is free as long as the copyright notice remains intact.
    
    var _disable_empty_list=false;
    var _hide_empty_list=false;
    
    // ------
    
    ///// DynamicDrive.com added function/////////////
    
    var onclickaction="alert"
    
    function goListGroup(){
    for (i=arguments.length-1;i>=0; i--){
    if (arguments[i].selectedIndex!=-1){
    var selectedOptionvalue=arguments[i].options[arguments[i].selectedIndex].value
    if (selectedOptionvalue!=""){
    if (onclickaction=="alert")
    alert(selectedOptionvalue)
    else if (newwindow==1)
    window.open(selectedOptionvalue)
    else
    window.location=selectedOptionvalue
    break
    }
    }
    }
    }
    
    ///// END DynamicDrive.com added function//////
    
    
    if (typeof(disable_empty_list)=="undefined") { disable_empty_list=_disable_empty_list; }
    if (typeof(hide_empty_list)=="undefined") { hide_empty_list=_hide_empty_list; }
    
    var cs_goodContent=true, cs_M="M", cs_L="L", cs_curTop=null, cs_curSub=null;
    
    function cs_findOBJ(obj,n) {
      for (var i=0; i<obj.length; i++) {
        if (obj[i].name==n) { return obj[i]; }
      }
      return null;
    }
    function cs_findContent(n) { return cs_findOBJ(cs_content,n); }
    
    function cs_findM(m,n) {
      if (m.name==n) { return m; }
    
      var sm=null;
      for (var i=0; i<m.items.length; i++) {
        if (m.items[i].type==cs_M) {
          sm=cs_findM(m.items[i],n);
          if (sm!=null) { break; }
        }
      }
      return sm;
    }
    function cs_findMenu(n) { return (cs_curSub!=null && cs_curSub.name==n)?cs_curSub:cs_findM(cs_curTop,n); }
    
    function cs_contentOBJ(n,obj){ this.name=n; this.menu=obj; this.lists=new Array(); this.cookie=""; }; cs_content=new Array();
    function cs_topmenuOBJ(tm) { this.name=tm; this.items=new Array(); this.df=0; this.addM=cs_addM; this.addL=cs_addL; }
    function cs_submenuOBJ(dis,link,sub) {
      this.name=sub;
      this.type=cs_M; this.dis=dis; this.link=link; this.df=0;
    
      var x=cs_findMenu(sub);
      this.items=x==null?new Array():x.items;
    
      this.addM=cs_addM; this.addL=cs_addL;
    }
    function cs_linkOBJ(dis,link) { this.type=cs_L; this.dis=dis; this.link=link; }
    
    function cs_addM(dis,link,sub) { this.items[this.items.length]=new cs_submenuOBJ(dis,link,sub); }
    function cs_addL(dis,link) { this.items[this.items.length]=new cs_linkOBJ(dis,link); }
    
    function cs_showMsg(msg) { window.status=msg; }
    function cs_badContent(n) { cs_goodContent=false; cs_showMsg("["+n+"] Not Found."); }
    
    function cs_optionOBJ(text,value) { this.text=text; this.value=value; }
    function cs_emptyList(list) { for (var i=list.options.length-1; i>=0; i--) { list.options[i]=null; } }
    function cs_refreshList(list,opt,df) {
      cs_emptyList(list);
    
      for (var i=0; i<opt.length; i++) {
        list.options[i]=new Option(opt[i].text, opt[i].value);
      }
    
      if (opt.length>0) {
        list.selectedIndex=df;
      }
    }
    function cs_getOptions(menu) {
      var opt=new Array();
      for (var i=0; i<menu.items.length; i++) {
        opt[i]=new cs_optionOBJ(menu.items[i].dis, menu.items[i].link);
      }
      return opt;
    }
    function cs_updateListGroup(contents,idx,sidx,mode) {
      var i=0, curItem=null, menu=contents.menu;
    
      while (i<idx) {
        menu=menu.items[contents.lists[i++].selectedIndex];
      }
    
      if (menu.items[sidx].type==cs_M && idx<contents.lists.length-1) {
        var df=cs_getIdx(mode,contents.cookie,idx+1,menu.items[sidx].df);
    
        cs_refreshList(contents.lists[idx+1], cs_getOptions(menu.items[sidx]), df);
        if (contents.cookie) {
          cs_setCookie(contents.cookie+"_"+(idx+1),df);
        }
    
        if (idx+1<contents.lists.length) {
          if (disable_empty_list) {
            contents.lists[idx+1].disabled=false;
          }
          if (hide_empty_list) {
            contents.lists[idx+1].style.display="";
          }
    
          cs_updateListGroup(contents,idx+1,df,mode);
        }
      }
      else {
        for (var s=idx+1; s<contents.lists.length; s++) {
          cs_emptyList(contents.lists[s]);
    
          if (disable_empty_list) {
            contents.lists[s].disabled=true;
          }
          if (hide_empty_list) {
            contents.lists[s].style.display="none";
          }
    
          if (contents.cookie) {
            cs_setCookie(contents.cookie+"_"+s,"");
          }
        }
      }
    }
    function cs_initListGroup(contents,mode) {
      var df=cs_getIdx(mode,contents.cookie,0,contents.menu.df);
    
      cs_refreshList(contents.lists[0], cs_getOptions(contents.menu), df);
      if (contents.cookie) {
        cs_setCookie(contents.cookie+"_"+0,df);
      }
    
      cs_updateListGroup(contents,0,df,mode);
    }
    
    function cs_updateList() {
      var contents=this.contents;
      for (var i=0; i<contents.lists.length; i++) {
        if (contents.lists[i]==this) {
          if (contents.cookie) {
            cs_setCookie(contents.cookie+"_"+i,this.selectedIndex);
          }
    
          if (i<contents.lists.length-1) {
            cs_updateListGroup(contents,i,this.selectedIndex,"");
          }
        }
      }
    }
    
    function cs_getIdx(mode,name,idx,df) {
      if (mode) {
        var cs_idx=cs_getCookie(name+"_"+idx);
        if (cs_idx!="") {
          df=parseInt(cs_idx);
        }
      }
      return df;
    }
    
    function _setCookie(name, value) {
      document.cookie=name+"="+value;
    }
    function cs_setCookie(name, value) {
      setTimeout("_setCookie('"+name+"','"+value+"')",0);
    }
    
    function cs_getCookie(name) {
      var cookieRE=new RegExp(name+"=([^;]+)");
      if (document.cookie.search(cookieRE)!=-1) {
        return RegExp.$1;
      }
      else {
        return "";
      }
    }
    
    // ----
    function addListGroup(n,tm) {
      if (cs_goodContent) {
        cs_curTop=new cs_topmenuOBJ(tm); cs_curSub=null;
    
        var c=cs_findContent(n);
        if (c==null) {
          cs_content[cs_content.length]=new cs_contentOBJ(n,cs_curTop);
        }
        else {
          delete(c.menu); c.menu=cs_curTop;
        }
      }
    }
    
    function addList(n,dis,link,sub,df) {
      if (cs_goodContent) {
        cs_curSub=cs_findMenu(n);
    
        if (cs_curSub!=null) {
          cs_curSub.addM(dis,link||"",sub);
          if (typeof(df)!="undefined") { cs_curSub.df=cs_curSub.items.length-1; }
        }
        else {
          cs_badContent(n);
        }
      }
    }
    
    function addOption(n,dis,link,df) {
      if (cs_goodContent) {
        cs_curSub=cs_findMenu(n);
    
        if (cs_curSub!=null) {
          cs_curSub.addL(dis,link||"");
          if (typeof(df)!="undefined") { cs_curSub.df=cs_curSub.items.length-1; }
        }
        else {
          cs_badContent(n);
        }
      }
    }
    
    function initListGroup(n) {
      var _content=cs_findContent(n), count=0;
      if (_content!=null) {
        contents=new cs_contentOBJ("cs_"+n,_content.menu);
        cs_content[cs_content.length]=contents;
    
        for (var i=1; i<initListGroup.arguments.length; i++) {
          if (typeof(arguments[i])=="object" && arguments[i].tagName && arguments[i].tagName=="SELECT") {
            contents.lists[count]=arguments[i];
    
            arguments[i].onchange=cs_updateList;
            arguments[i].contents=contents; arguments[i].idx=count++;
          }
          else if (typeof(arguments[i])=="string" && /^[a-zA-Z_]\w*$/.test(arguments[i])) {
            contents.cookie=arguments[i];
          }
        }
    
        if (contents.lists.length>0) {
          cs_initListGroup(contents,contents.cookie);
        }
      }
    }
    
    function resetListGroup(n) {
      var contents=cs_findContent("cs_"+n);
      if (contents!=null && contents.lists.length>0) {
        cs_initListGroup(contents,"");
      }
    }
    // ------
    -- config.js --
    Code:
    //var hide_empty_list=true; //uncomment this line to hide empty selection lists
    var disable_empty_list=true; //uncomment this line to disable empty selection lists
    
    var onclickaction="alert" //set to "alert" or "goto". Former is for debugging purposes, to tell you the value of the final selected list that will be used as the destination URL. Set to "goto" when below configuration is all set up as desired. 
    
    var newwindow=0 //Open links in new window or not? 1=yes, 0=no.
    
    /////DEFINE YOUR MENU LISTS and ITEMS below/////////////////
    
    
    addListGroup("chainedmenu", "First-Select");
    
    addOption("First-Select", "Select a course type", "", 1); //HEADER OPTION
    addList("First-Select", "New Staff", "", "NewStaff");
    addList("First-Select", "All Staff", "", "AllStaff");
    addList("First-Select", "Learning, Teaching, Research and Knowledge Exchange", "", "Learning");
    addList("First-Select", "Leaders and Managers", "", "Leaders");
    
    // - Start of New Staff Courses
    
    
    addOption("NewStaff", "Select a course", "", 1); //HEADER OPTION
    addList("NewStaff", "An Introduction to Teaching in HE ", "", "NewStaff-Teaching");
    addList("NewStaff", "CLIC Learn Basic for Instructors  ", "", "NewStaff-CLIC");
    addList("NewStaff", "Equality and Diversity ", "", "NewStaff-Equality");
    addList("NewStaff", "IT Essentials for New Staff ", "", "NewStaff-IT");
    addList("NewStaff", "Staff Orientation", "", "NewStaff-StaffOrientation");
    addList("NewStaff", "Using AV Services Effectively ", "", "NewStaff-AV");
    
    
    
    // - End of new staff courses
    
    
    // - New Staff course dates
    
    addOption("NewStaff-StaffOrientation", "Select a date", "", 1); //HEADER OPTION
    addOption("NewStaff-StaffOrientation", "9th January 2013");
    addOption("NewStaff-StaffOrientation", "17th April 2013");
    addOption("NewStaff-StaffOrientation", "12th September 2013");
    
    addOption("NewStaff-Equality", "Select a date", "", 1); //HEADER OPTION
    addOption("NewStaff-Equality", "7th February 2013");
    addOption("NewStaff-Equality", "18th April 2013");
    addOption("NewStaff-Equality", "13th September 2013");
    
    addOption("NewStaff-Teaching", "Select a date", "", 1); //HEADER OPTION
    addOption("NewStaff-Teaching", "10th January 2013");
    addOption("NewStaff-Teaching", "25th April 2013");

  • #2
    Senior Coder rnd me's Avatar
    Join Date
    Jun 2007
    Location
    Urbana
    Posts
    4,277
    Thanks
    10
    Thanked 581 Times in 562 Posts
    the .value of a <select> is the currently selected item, lust like an input.
    if you submit the form, it should have the selected values in it, just like a hidden input would.

    still, for the sake of illustration, here a simplified example of what you are trying to do:

    Code:
    <form onsubmit=' x.value=sel.value; alert(x.value) '>
    
     <select id=sel name=sel>
      <option> 1 </option>
      <option> 2 </option>
      <option value='three'> 3 </option>
     </select>
    
     <input id=x name=x value='-1'>
    
     <input type=submit>
    </form>
    my site (updated 13/9/26)
    BROWSER STATS [% share] (2014/5/28) IE7:0.1, IE8:5.3, IE11:8.4, IE9:3.2, IE10:3.2, FF:18.2, CH:46, SF:7.9, NON-MOUSE:32%


  •  

    Tags for this Thread

    Posting Permissions

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