skip to Main Content

I’ve been given a project to generate a HTML table in JS from arrays. I’ve made similar code in the past, but this one isn’t working at all. I’m less concerned with good practice (for ex, using document.write vs innerHTML or appending to the DOM), than actual functioning. Any insight would be appreciated. My code:

<!doctype html>

<html>
<head>
<meta charset="utf-8">
<title>Web Program Requirements</title>


<script language="javascript">

function sched() {

    var courses = new Array[];
    var courses[0] = new Array["Oral Communication","ENG 171", "3","" ];
    var courses[1] = new Array["Applications/Concepts","CIT 110",  "3","ESL"];
    var courses[2] = new Array["SQL Programming","CIT 236", "3","CIT 110"];
    var courses[3] = new Array["HTML and Dreamweaver", "CMT 111", "3","pre/"];
    var courses[4] = new Array["Javascript",  "CMT 113", "3","CIT 110 and CMT"];
    var courses[5] = new Array["Flash","CMT 115", "3","CMT 113"];
    var courses[6] = new Array[ "XML", "CMT 117", "3","CMT 111"];
    var courses[7] = new Array[ "Cascading Style Sheets","CMT 125", "3","pre"];
    var courses[8] = new Array[ "XSL", "CMT 211", "3","CMT 111 and CMT 117"];
    var courses[9] = new Array["ASP.NET","CMT 215", "3","CIT 128 or CIT 236"];
    var courses[10] = new Array["PHP/MySQL", "CMT 241", "3", "CMT 111 and CIT"];
    var courses[11] = new Array["Windows Operating Systems", "CIT 268", "3","CIT 110 or CIT 112 or CIT 113 or CIT 120 or Instructor permission or Chair approval"];
    var courses[12] = new Array[ "Digital Imaging with Photoshop","VMA 105", "3", "ENG 095 and MAT 093 or placement"];
    var courses[13] = new Array["Web Development Internship","CMT 299", "3","Chair approval"];

    document.write("<table border='1'><tr><th>Web Development Concentration Courses</th></tr><tbody>");

    for (var i = 0; i < courses.length; i++) {
        document.write('<tr><td>'+ courses[i][0] + '</td><td>' + courses[i][1] + '</td><td>' + '3' + '</td><td>' + courses[i][2] +'</td><tr/>');
        courses[i] ++;
    }

    document.write("</tbody></table>");

}
</script>

</head>


<body>
<input type="button" value="Click here" onClick="sched()" >

</body>

</html>

2

Answers


  1. I have written some comments in your code. This should work:

    function sched() {
        // use () to create array instead of []
        // define size of array if you are accessing its elements right on the next lines
        var courses = new Array(14); 
        // var coursers[0] <-- use it without `var`, you are not defining a new variable
        // array can be created with [] and values
        courses[0] = ['Oral Communication', 'ENG 171', '3', '']; 
        courses[1] = ['Applications/Concepts', 'CIT 110', '3', 'ESL'];
        courses[2] = ['SQL Programming', 'CIT 236', '3', 'CIT 110'];
        courses[3] = ['HTML and Dreamweaver', 'CMT 111', '3', 'pre/'];
        courses[4] = ['Javascript', 'CMT 113', '3', 'CIT 110 and CMT'];
        courses[5] = ['Flash', 'CMT 115', '3', 'CMT 113'];
        courses[6] = ['XML', 'CMT 117', '3', 'CMT 111'];
        courses[7] = ['Cascading Style Sheets', 'CMT 125', '3', 'pre'];
        courses[8] = ['XSL', 'CMT 211', '3', 'CMT 111 and CMT 117'];
        courses[9] = ['ASP.NET', 'CMT 215', '3', 'CIT 128 or CIT 236'];
        courses[10] = ['PHP/MySQL', 'CMT 241', '3', 'CMT 111 and CIT'];
        courses[11] = ['Windows Operating Systems', 'CIT 268', '3', 'CIT 110 or CIT 112 or CIT 113 or CIT 120 or Instructor permission or Chair approval'];
        courses[12] = ['Digital Imaging with Photoshop', 'VMA 105', '3', 'ENG 095 and MAT 093 or placement'];
        courses[13] = ['Web Development Internship', 'CMT 299', '3', 'Chair approval'];
        document.write('<table border='1'><tr><th>Web Development Concentration Courses</th></tr><tbody>');
        for (var i = 0; i < courses.length; i++) {
            document.write('<tr><td>' + courses[i][0] + '</td><td>' + courses[i][1] + '</td><td>' + '3' + '</td><td>' + courses[i][2] + '</td><tr/>');
            // courses[i]++; <--- this does not makes sense, you are trying to increment array
        }
        document.write('</tbody></table>');
    }
    sched();
    

    Hope that helps.

    Login or Signup to reply.
    1. There’s a syntax error in your code. Uncaught SyntaxError: Unexpected token ] should tell you something is wrong with ] and that’s related to how you initialize the arrays. You can either do it with [1,2,3] or new Array(1,2,3) but not new Array[1,2,3]
    2. Get rid of the var when you’re adding elements into courses.
    <script>
    
    function sched() {
    
        var courses = new Array();
        courses[0] = new Array("Oral Communication","ENG 171", "3","");
        courses[1] = new Array("Applications/Concepts","CIT 110",  "3","ESL");
        courses[2] = new Array("SQL Programming","CIT 236", "3","CIT 110");
        courses[3] = new Array("HTML and Dreamweaver", "CMT 111", "3","pre/");
        courses[4] = new Array("Javascript",  "CMT 113", "3","CIT 110 and CMT");
        courses[5] = new Array("Flash","CMT 115", "3","CMT 113");
        courses[6] = new Array( "XML", "CMT 117", "3","CMT 111");
        courses[7] = new Array( "Cascading Style Sheets","CMT 125", "3","pre");
        courses[8] = new Array( "XSL", "CMT 211", "3","CMT 111 and CMT 117");
        courses[9] = new Array("ASP.NET","CMT 215", "3","CIT 128 or CIT 236");
        courses[10] = new Array("PHP/MySQL", "CMT 241", "3", "CMT 111 and CIT");
        courses[11] = new Array("Windows Operating Systems", "CIT 268", "3","CIT 110 or CIT 112 or CIT 113 or CIT 120 or Instructor permission or Chair approval");
        courses[12] = new Array( "Digital Imaging with Photoshop","VMA 105", "3", "ENG 095 and MAT 093 or placement");
        courses[13] = new Array("Web Development Internship","CMT 299", "3","Chair approval");
    
        document.write("<table border='1'><tr><th>Web Development Concentration Courses</th></tr><tbody>");
    
        for (var i = 0; i < courses.length; i++) {
            document.write('<tr><td>'+ courses[i][0] + '</td><td>' + courses[i][1] + '</td><td>' + '3' + '</td><td>' + courses[i][2] +'</td><tr/>');
        }
    
        document.write("</tbody></table>");
    
    }
    </script>
    
    <body>
        <input type="button" value="Click here" onClick="sched()" >
    </body>
    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search