分解大型下拉列表以避免具有巨大功能

时间:2012-03-08 07:10:47

标签: javascript jsp

我在Javascript中创建了一个接收列表的函数,我必须初始化我依赖的下拉列表所需的所有值。代码工作正常,问题是页面中现在有太多数据,而且在函数本身。有没有办法可以用列表创建单独的页面/类,然后通过调用它们将它们包含在函数中?

这是我的代码,此代码用于依赖的下拉列表:

function dropdownlist(listindex)
{
    //document.formname.departments.options.length = 0;
    //document.formname.courseName.options.length = 0;
    //document.formname.courseCode.options.length = 0;
    //document.formname.subName.options.length = 0;
    document.formname.subCode.options.length = 0;

    switch (listindex)
    {
            //Faculties
            //Departments
            case "Sciences" :
            document.formname.departments.options[0]=new Option("Select Department","");
            document.formname.departments.options[1]=new Option("Animal Sciences","Animal Sciences");
            document.formname.departments.options[2]=new Option("Crop Science","Crop Science");
            document.formname.departments.options[3]=new Option("Chemistry","Chemistry");
            document.formname.departments.options[4]=new Option("Mathematics and Statistics","Mathematics and Statistics");
            document.formname.departments.options[5]=new Option("Nature Conservation","Nature Conservation");
            document.formname.departments.options[6]=new Option("Environmental Health","Environmental Health");
            document.formname.departments.options[7]=new Option("Physics","Physics");
            break;

            case "Humanities" :
            document.formname.departments.options[0]=new Option("Select Department","");
            document.formname.departments.options[1]=new Option("Journalism","Journalism");
            document.formname.departments.options[2]=new Option("Educational Studies","Educational Studies");
            document.formname.departments.options[3]=new Option("Public Management","Public Management");
            document.formname.departments.options[4]=new Option("Mathematics","Mathematics");
            document.formname.departments.options[5]=new Option("Law","Law");
            document.formname.departments.options[6]=new Option("Public Relations","Public Relations");
            document.formname.departments.options[7]=new Option("Applied Languages","Applied Languages");
            document.formname.departments.options[8]=new Option("Business Commerce","Business Commerce");
            document.formname.departments.options[9]=new Option("Safety and Security Management","Safety and Security Management");
            break;

            case "Engineering And Built Environm" :
            document.formname.departments.options[0]=new Option("Select Department","");
            document.formname.departments.options[1]=new Option("Architecture","Architecture");
            document.formname.departments.options[2]=new Option("Building Sciences","Building Sciences");
            document.formname.departments.options[3]=new Option("Civil Engineering","Civil Engineering");
            document.formname.departments.options[4]=new Option("Chemical and Metallurgical Eng","Chemical and Metallurgical Eng");
            document.formname.departments.options[5]=new Option("Eletrical Engineering","Eletrical Engineering");
            document.formname.departments.options[6]=new Option("Geomatics","Geomatics");
            document.formname.departments.options[7]=new Option("Industrial Engineering","Industrial Engineering");
            document.formname.departments.options[8]=new Option("Machanical Engineering","Machanical Engineering");
            break;

            case "Information and Communication " :
            document.formname.departments.options[0]=new Option("Select Department","");
            document.formname.departments.options[1]=new Option("Computer Science","Computer Science");
            document.formname.departments.options[2]=new Option("Computer Systems Engineering","Computer Systems Engineering");
            document.formname.departments.options[3]=new Option("End User Computing","End User Computing");
            document.formname.departments.options[4]=new Option("Informatics","Informatics");
            document.formname.departments.options[5]=new Option("Information Technology","Information Technology");
            document.formname.departments.options[6]=new Option("Software Engineering","Software Engineering");
            document.formname.departments.options[7]=new Option("Web and Multimedia Computing","Web and Multimedia Computing");
            break;

            case "Management Sciences" :
            document.formname.departments.options[0]=new Option("Select Department","");
            document.formname.departments.options[1]=new Option("Hospitality Management","Hospitality Management");
            document.formname.departments.options[2]=new Option("Management and Entrepreneurship","Management and Entrepreneurship");
            document.formname.departments.options[3]=new Option("Logistics and Sport Management","Logistics and Sport Management");
            document.formname.departments.options[4]=new Option("Office Management and Technology","Office Management and Technology");
            document.formname.departments.options[5]=new Option("Operations Management","Operations Management");
            document.formname.departments.options[6]=new Option("People Management and development","People Management and development");
            document.formname.departments.options[7]=new Option("Tourism Management","Tourism Management");
            document.formname.departments.options[8]=new Option("Marketing,Logistics and Sport Management","Marketing,Logistics and Sport Management");
            document.formname.departments.options[9]=new Option("Office Management Technology","Office Management Technology");
            break;



            //COURSE NAMES UNDER DEPARTMENTS
            /*****************Faculty of Engineering and the Built Environment***********************/
            case "Architecture" :
            document.formname.courseName.options[0]=new Option("Select Course","");
            document.formname.courseName.options[1]=new Option("Professional","Professional");
            document.formname.courseName.options[2]=new Option("Architectural Technology","Architectural Technology");
            break;
            case "Building Sciences" :
            document.formname.courseName.options[0]=new Option("Select Course","");
            document.formname.courseName.options[1]=new Option("Building","Building");
            document.formname.courseName.options[2]=new Option("Construction Management","Construction Management");
            document.formname.courseName.options[3]=new Option("Quantity Surveying","Quantity Surveying");
            break;
            case "Chemical and Metallurgical Eng" :
            document.formname.courseName.options[0]=new Option("Select Course","");
            document.formname.courseName.options[1]=new Option("Chemical","Chemical");
            document.formname.courseName.options[2]=new Option("Metallurgy","Metallurgy");
            document.formname.courseName.options[3]=new Option("Refractories","Refractories");
            break;
            case "Civil Engineering" :
            document.formname.courseName.options[0]=new Option("Select Course","");
            document.formname.courseName.options[1]=new Option("Civil","Civil");
            document.formname.courseName.options[2]=new Option("Construction Management","Construction Management");
            document.formname.courseName.options[3]=new Option("Environmental Engineering","Environmental Engineering");
            document.formname.courseName.options[4]=new Option("Geotechnical Engineering","Geotechnical Engineering");
            document.formname.courseName.options[5]=new Option("Structural Engineering","Structural Engineering");
            document.formname.courseName.options[6]=new Option("Transportation Engineering","Transportation Engineering");
            document.formname.courseName.options[7]=new Option("Urban Engineering","Urban Engineering");
            document.formname.courseName.options[8]=new Option("Water Engineering","Water Engineering");
            break;
            case "Eletrical Engineering" :
            document.formname.courseName.options[0]=new Option("Select Course","");
            document.formname.courseName.options[1]=new Option("Eletrical","Eletrical");
            document.formname.courseName.options[2]=new Option("Electronic Engineering","Electronic Engineering");
            document.formname.courseName.options[3]=new Option("Power Engineering","Power Engineering");
            break;
            case "Geomatics" :
            document.formname.courseName.options[0]=new Option("Select Course","");
            document.formname.courseName.options[1]=new Option("Surveying","Surveying");
            document.formname.courseName.options[2]=new Option("Cartography","Cartography");
            break;
            case "Industrial Engineering" :
            document.formname.courseName.options[0]=new Option("Select Course","");
            document.formname.courseName.options[1]=new Option("Industrial","Industrial");
            document.formname.courseName.options[2]=new Option("Technology Management","Technology Management");
            break;
            case "Machanical Engineering" :
            document.formname.courseName.options[0]=new Option("Select Course","");
            document.formname.courseName.options[1]=new Option("Mechanical","Mechanical");
            document.formname.courseName.options[2]=new Option("Mechatronics","Mechatronics");
            document.formname.courseName.options[3]=new Option("Polymer Technology","Polymer Technology");
            document.formname.courseName.options[4]=new Option("Three-Dimension Design","Three-Dimension Design");
            break;

            /******************************COURSE CODES = Faculty of Engineering and the Built Environment****************************************/
            case "Professional" :
            document.formname.courseCode.options[0]=new Option("Select Course","");
            document.formname.courseCode.options[1]=new Option("MTPSSO","MTPSSO");
            document.formname.courseCode.options[2]=new Option("BTPS09","BTPS09");
            break;
            case "Architectural Technology" :
            document.formname.courseCode.options[0]=new Option("Select Course","");
            document.formname.courseCode.options[1]=new Option("MTAD96","MTAD96");
            document.formname.courseCode.options[2]=new Option("BTAQ95","BTAQ95");
            break;
            case "Building" :
            document.formname.courseCode.options[0]=new Option("Select Course","");
            document.formname.courseCode.options[1]=new Option("NDBU04","NDBU04");
            break;
            case "Construction Management" :
            document.formname.courseCode.options[0]=new Option("Select Course","");
            document.formname.courseCode.options[1]=new Option("BTCU02","BTCU02");
            document.formname.courseCode.options[2]=new Option("MTCUSO/MTCU95","MTCUSO/MTCU95");
            break;
            case "Quantity Surveying" :
            document.formname.courseCode.options[0]=new Option("Select Course","");
            document.formname.courseCode.options[1]=new Option("BTQCE03","BTQCE03");
            document.formname.courseCode.options[2]=new Option("MTQSSO/MTQS95","MTQSSO/MTQS95");
            break;
            case "Chemical" :
            document.formname.courseCode.options[0]=new Option("Select Course","");
            document.formname.courseCode.options[1]=new Option("NDCE03","NDCE03");
            document.formname.courseCode.options[2]=new Option("NDCEF0","NDCEF0");
            document.formname.courseCode.options[3]=new Option("BTCE02","BTCE02");
            document.formname.courseCode.options[4]=new Option("MTCE95","MTCE95");
            document.formname.courseCode.options[5]=new Option("DTCE96","DTCE96");
            break;
            case "Metallurgy" :
            document.formname.courseCode.options[0]=new Option("Select Course","");
            document.formname.courseCode.options[1]=new Option("NDMY03","NDMY03");
            document.formname.courseCode.options[2]=new Option("NDMYF0","NDMYF0");
            document.formname.courseCode.options[3]=new Option("BTMY02","BTMY02");
            document.formname.courseCode.options[4]=new Option("MTMY96","MTMY96");
            document.formname.courseCode.options[5]=new Option("DTMY96","DTMY96");
            break;
            case "Refractories" :
            document.formname.courseCode.options[0]=new Option("Select Course","");
            document.formname.courseCode.options[1]=new Option("BTKR01","BTKR01");
            break;

            case "Civil" :
            document.formname.courseCode.options[0]=new Option("Select Course","");
            document.formname.courseCode.options[1]=new Option("NDCI03","NDCI03");
            document.formname.courseCode.options[2]=new Option("NDCIF0","NDCIF0");
            document.formname.courseCode.options[3]=new Option("BTKG02","BTKG02");
            document.formname.courseCode.options[4]=new Option("BTOI02","BTOI02");
            document.formname.courseCode.options[5]=new Option("BTGO02","BTGO02");
            document.formname.courseCode.options[6]=new Option("BTSQ02","BTSQ02");
            document.formname.courseCode.options[7]=new Option("BTTO02","BTTO02");
            document.formname.courseCode.options[8]=new Option("MTCI95","MTCI95");
            document.formname.courseCode.options[9]=new Option("DTCI96","DTCI96");
            break;

            /*****************DEPARTMENTS OF ICT***********************/

            case "Computer Science" :
            document.formname.courseName.options[0]=new Option("Select Course","");
            document.formname.courseName.options[1]=new Option("Information Networks","Information Networks");
            document.formname.courseName.options[2]=new Option("Computer Science and Data Processing","Computer Science and Data Processing");
            document.formname.courseName.options[3]=new Option("Information Technology","Information Technology");
            document.formname.courseName.options[3]=new Option("Technical Applications","Technical Applications");
            document.formname.courseName.options[4]=new Option("Professional Practise in Information Technology","Professional Practise in Information Technology");
            break;

            /*****************COURSE CODES IN DEPARTMENTS OF ICT*********************************/
            case "Information Technology" :
            document.formname.courseCode.options[0]=new Option("Select Course","");
            document.formname.courseCode.options[1]=new Option("NDIT04/NDIT12","NDIT04/NDIT12");
            document.formname.courseCode.options[2]=new Option("NDITF1","NDITF1");

            break;
            case "Information Networks" :
            document.formname.courseCode.options[0]=new Option("Select Course","");
            document.formname.courseCode.options[1]=new Option("MTINS0","MTINS0");
            document.formname.courseCode.options[2]=new Option("MTIN01","MTIN01");
            break;
            case "Computer Science and Data Processing" :
            document.formname.courseCode.options[0]=new Option("Select Course","");
            document.formname.courseCode.options[1]=new Option("DTIN08","DTIN08");
            document.formname.courseCode.options[2]=new Option("DTIL08","DTIL08");
            document.formname.courseCode.options[3]=new Option("DTPF08","DTPF08");
            break;
            case "Technical Applications" :
            document.formname.courseCode.options[0]=new Option("Select Course","");
            document.formname.courseCode.options[1]=new Option("NDIL04/NDIL12","NDIL04/NDIL12");
            document.formname.courseCode.options[2]=new Option("BTIL05","BTIL05");
            document.formname.courseCode.options[3]=new Option("MTIL95","MTIL95");
            break;

            case "Professional Practise in Information Technology" :
            document.formname.courseCode.options[0]=new Option("Select Course","");
            document.formname.courseCode.options[1]=new Option("BTPF03","BTPF03");
            document.formname.courseCode.options[2]=new Option("MTPFS1","MTPFS1");
            document.formname.courseCode.options[3]=new Option("MTPF01","MTPF01");
            break;

            //SUBJECTS NAMES IN THE COMPUTER SCIENCE DEPARTMENT...Technical Apps
            case "NDIL04/NDIL12":
            document.formname.subName.options[0]=new Option("Select Subject","");
            document.formname.subName.options[1]=new Option("Industry Exposure","Industry Exposure");
            break;

            case "Industry Exposure":
            document.formname.subCode.options[0]=new Option("Select Subject Code","");
            document.formname.subCode.options[1]=new Option("IDC30DB","IDC30DB");
            break;

    }
    return true;
}

2 个答案:

答案 0 :(得分:1)

我打赌你可以做得更短,但这是一个开始:

var sciences = [["...", "..."], ["...", "..."], ["...", "..."],...];
var humanities = [["...", "..."], ["...", "..."], ["...", "..."],...];
...
switch (listIndex) {
    case "Sciences" :
        for(int i = 0; i < sciences.length; i++) {
            document.formname.departments.options[i] = new Option(sciences[i][0], sciences[i][1]);
        }
        break;
    case...
....
}

答案 1 :(得分:0)

基本思路应该(就像在任何情况下一样)将重复的代码移动到一个函数中,将数据分开并将它们放在一起(如果需要的话)。下面的代码是一个开头,应该比你的短得多。

var departments = {
      'Sciences': [ '...', '...', '...' ],
      'Humanities': [ '...', '...', '...' ],
      ...
  },
    courseNames = {
      'Sciences': [ '...', '...', '...' ],
      'Humanities': [ '...', '...', '...' ],
      ...
  },
  ...;

function createOptions( items ) {
  options = [];
  for( var i=0; max=items.length; i<max; ++i ) {
     options.push( new Option( data[i], data[i] );
  }
  return options;
}

document.formname.departments.options = createOptions( departments );
document.formname.courseName.options = createOptions( courseName );