Tutorial Webpage for

Lecture Cloud- and Web-Technologies


JS - Interactive Forms

In this exercise we develop an interactive form about job experiences, which may be part of a job application form. Depending on the type of job chosen different input possibilities should be given (for the cook the number of stars and his/her specialties, for the software developer his/her homepage and his/her programming languages, for all a field for notes). Furthermore, it should be possible to add more job experiences. Again please try the rendered solution to find out how the interactive form could look and behave like.
You can use the javascript function element.insertAdjacentHTML(A, '<p>new paragraph</p>'); to add new html code (here a new paragraph) right before/after the (opening) tag of element (A is 'BeforeBegin'/'AfterBegin') or before/after the closing tag of element (A is 'BeforeEnd'/'AfterEnd').


Please use the following editor for your exercise. You can run the content of the editor by clicking on the tab 'Run'...

Output of Editor Content

The result of running the editor content is as follows:

Output of the Solution

The output of the solution is as follows:


Please have a look at the solution only after you have finished working on your own solution. Otherwise the learn effect is much less.