代做AST20201、代写Java编程设计-代写Java编程

AST20201 Web Programming

Lab 4 JavaScript-2

Submission:

Save all completed html, CSS, images files in a folder name lab4_yourname, with sub-folders for

organize the folders if necessary. Zip the folder and submit to Moodle before the due date

specified in Moodle. Note, you need to make sure all image paths/links could be work

appropriately in your submitted folder and subfolders.

Task

Start the work with the file called “attendance_start.html”. Find all ‘TODO” comments and

insert your code to complete the followings.

When load the page, it shows

a list of students’ names.

If the lecturer checks some

students, such as the first 4

students in this case.

Some basic criteria:

• The table should be dynamic by use functions to insert rows. Therefore, when the

webpage is first loaded or reloaded, the populate() function is called to insert rows of

sample student records into the absentees table. All students are assumed absent at the

beginning. Note: in this exercise, it directly adds a group of names inside the function.

[you may change it to read a database, or XML, JSON files in later to provide dynamic

list]

• The webpage is responsive – when the device width gets to be less than or equal to 600

pixels, then the three columns willstack on topof each otherinstead of next to each other.

• You are expected to use JavaScript to implement the solution to this question. However, if

you do want to use jQuery instead, you are still allowed to do so.

• Except jQuery, you are NOT allowed to use any other libraries or 3rd party plugins.

• All your code should appear in one HTML file only, i.e., no separate .js file(s) [Note

separate css file is allowed].

[It your submission include any parts of code is not developed by you; it will not be given

marks. Therefore, try to complete the task base on your own codes as far as possible]

The checked students will be

display in the same page.