How to create textboxes dynamically?

[Anu satya]

Hi All,
I am developing a web page using HTML,JSP and JAVAScript.

Problem description:
There is a given number. Say "amount"
User has to enter numbers in the textbox provided. If the user entered value in the text box is equal to the "amount", then user is taken to the next page. OTherwise,
1. If Value entered in the textbox is greater than "amount". error/alert message is displayed. and user is not allowed to navigate to the next page.
2. If value entered in the textbox is less than "amount", another textbox has to be displayed(dynamically) to enter the balance amount.....

So, this loop goes on till the sum of values in the textboxes becomes equal to "amount".

How to create these textboxes dynamicall? only when sumof values in the textboxes are less than a given number("amount")?

Any one please help. Thanks for your time and help.

[Abrahim Daver]

Well,If you are using table with an id to put textfield, the you can use that id of table to add a row and data in that table, and in that td, you can put textfield, which has same name as your first textfield. Now while comparing the amount, you will get array of textfield values. From which you can get values to add and compare. Hope this will help.

You can use following javascript function for adding the row dynamically

var tbl = document.getElementById("tableId");
tbody = tbl.getElementsByTagName("TBODY")[0];
row = document.createElement("<tr>");
td1= document.createElement("<td>");
ele1 = document.createElement("<input type='text' name='textFieldName'>");
td1.appendChild(ele1);
row.appendChild(td1);
tbody.appendChild(row);

Thanks,
Abra

[LIST]

[Anu satya]

HI,
Thank you for the help.
I could able to display the text box. I have few doubts in this:
1)Second row of textboxes are displayed after submit button, but, i want to display them before submit button.
2)How do i get array of textelements to compare?
3)i am finding dificulties to sum the values.
Can anyone please help me in this regard?

Thanks for your time and help

[Abrahim Daver]

You can make two tables, having separate ids, one for TextFields and another for Submit button. There, it requires to be aligned properly.
Now regarding getting array of textfields, you can get lengths of elements of same name using document.forms[0].elements['textFieldName'].length,
and loop throught it, using document.forms[0].elements['textFieldName'][i].value, where i is an integer, incrementing by one.
Hope this will help
Abra

[Anu satya]

Thank you Abrahim. Thanks for your help