I have attached an image.please check this.I have 3 buttons on the page such as Add certificate,Add Module and Add Paper.
When the page is loading first time I will have only add certificate and Add Module textbox and Add paper textbox with button.There will be only one Add certificate button always in the page .the changing sections are add module and addpaper and also I can add multiple certificate below as shown in the image.
Basicaly I need to create a multiple items on the correct postion.If I select a add module in the first part it should only be added in first part.If I add a module in second part it should always added in the second part.
Not having seem the image yet, I would say that the only appropriate way to do this is without scripting, to instead use forms and server-side programming.
The attachment is still pending approval, without which a judgement cannot be made.
I still don’t understand the question very well so take this with a pinch of salt as I may say something completely stupid…
I don’t want to intract with database,On submit I will have interaction with db.There is no need to intact with db before that.
I think you have not yet got my question.
I don’t have any specific link for a case like this. I use to have a link to a mortage form that used this type of approach to show parts of the form depending on the user’s answers but I deleted it long ago.
The other link that I have is in Spanish but basically you need to work with appendChild and appendNode.
You will need to create event handlers for your buttons. The functions need to be aware of the position of the button in the dom hiearchy, so that when further new elements are created as a result of clicking the button, the new elements get placed into the appropriate location in the dom.
The event handler for add certificate would just locate the one and only certificateList, and append new dom elements at the end.
The event handler for add module would traverse up the dom, starting from the clicked button. The traversal stops when you find an element with class=“moduleList”. Append new elements to the end.
Same goes for add paper, traverse up until you find the closest module.