A Collapsable List 1

[Olorin1]

Hey there,

Im trying to add a collapsable list to a form so that the user is able to fill in four fields (being in a table) and then click on an arrow which would open the collapsable list. Simply adding another row to the list. (the next row containing the same fields to be filled in but for a new item.) The problem is i cant find a decent list tutorial anywhere which shows me a concrete method. Can you please go over the scripting for this, so that i have a clear process to follow. Thank you.

David Stephens
HRPAO

 

[AndrewGrabovsky]

Hi Olorin1!
Here is what you need:

To create an option to add to an existing Select object:

optionName = new Option([text, value, defaultSelected, selected])

To add the new option to an existing Select object:

selectName.options[index1]=optionName

To delete an option from a Select object:

selectName.options[index1] = null

Sorry I have no time now to write you any "live" example, but this syntax will help you for sure.
Also, you may manipulate your list during runtime, like changing the list option text.
This code does this:

<SCRIPT>
function updateList(theForm, i)
{   theForm.userChoice.options.text = theForm.whatsNew.value 
theForm.userChoice.options.selected = true}
</SCRIPT>

<FORM>
<SELECT name=&quot;userChoice&quot;>   
<OPTION>Choice 1   
<OPTION>Choice 2   
<OPTION>Choice 3
</SELECT>
<BR>New text for the option:
<INPUT TYPE=&quot;text&quot; NAME=&quot;whatsNew&quot;>
<BR>Option to change (0, 1, or 2):
<INPUT TYPE=&quot;text&quot; NAME=&quot;idx&quot;>
<BR><INPUT TYPE=&quot;button&quot; VALUE=&quot;Change Selection&quot;onClick=&quot;updateList(this.form, this.form.idx.value)&quot;>
</FORM>

Enjoy Javascript!

Andrew | starway@mail.com

 

[Olorin1]

Hello again,

Thanks for the tip but it wasn't really what i was looking for. I should have better explained myself.

What i mean is, lets say i have a table. 4 rows and 4 cols.
If the user fills in all 4 rows but still needs to add more information, they will need a new row. Like in a collapsable list where; when the user clicks on a link they get a new sublist of links. I hoped to add a button which would fire a function adding a new row. Each cell in the new row being the same as those above prior to data entry.

The idea is to allow a form to look good and yet allow for a possiblity of many text boxes only when needed.

Does this make more sense? Can you help?

Thanks again,
David Stephens

 

[AndrewGrabovsky]

It cannot be done without reloading of a page.