Creating a row of fields as needed with incrementing Names not working as planned

[CG Art Designs]

Creating a form that allows a user to track their sales. We set the initial row position with 7 fields in that row.

When they push a button, it should be able to create another row with the same fields, but the fields name should increment by 1 and that is failing.

Second issue is a dummy field is created to indicate the start position of the next row, it works for the second row but then fails there after. 

I'm sure there is a better way to do this, but my attempts at reading the documentation and implementing it is not working.

I've attached my code with some comments. 

Any advice would be appreciated, thanks in advance.

//Inital row creation after user pushes a button

var g=this.getField("dummy"); // Does dummy exist already?

if ( g==null ) { // dummy doesn't exist, we will hardcode initial row placement

 f = this.addField("Customer Name Entry", "text", this.pageNum, [5,660,165,645]);
 f = this.addField("Policy Number Entry", "text", this.pageNum, [175,660,265,645]);
 f = this.addField("Business Line Entry", "text", this.pageNum, [275,660,335,645]);
 f = this.addField("Premium Amount Entry", "text", this.pageNum, [345,660,400,645]);
 f = this.addField("Written Date Entry", "text", this.pageNum, [410,660,465,645]);
 f = this.addField("Issued Date Entry", "text", this.pageNum, [475,660,530,645]);
 f = this.addField("Commission Entry", "text", this.pageNum, [540,660,595,645]);
 f = this.addField("dummy", "text", this.pageNum, [5,640,165,625]);
 f.display = display.hidden;
}
else { //If dummy does exist, then this will be the next row below created.

 var f = this.getField("dummy"); // lets get the rect for this field since it will indicate the start of the next row

 var myRect = f.rect;
 var Y = 5; //we move this 5 pts down
 myRect[0] = f.rect[0];
 myRect[1] = f.rect[1]+Y;
 myRect[2] = f.rect[2];
 myRect[3] = f.rect[3]+Y;

 this.removeField("dummy"); // We don't need this one anymore, remove it.

 var i = 0;
 f = this.addField("Customer Name Entry " ++i, "text", this.pageNum, myRect); // Note Name field should increment by 1 each time  submit button is pressed, but it's not working like I thought. To save time, I've not created the following 6 fields in the same row. But those will need to be created as well.

 var f = this.getField("Customer Name Entry " ++i); // we want the new rect for this field that was just created below the first row

 var myRect = f.rect;
 var Y = 5; // we move it down 5 points
 myRect[0] = f.rect[0];
 myRect[1] = f.rect[1]+Y;
 myRect[2] = f.rect[2];
 myRect[3] = f.rect[3]+Y;

 f = this.addField("dummy", "text", this.pageNum, myRect); // We add another dummy field to indicate the start of the next row  position.
}

[Bernd Alheit]

You use

  var i = 0;

When you increment the i you will get always a 1.

Use a global variable or a hidden form text field.

[Asim123]

Wouldn't be easier to just make second row and use button to show/hide? 

[CG Art Designs]

The amount of rows could be unknown. I currently mimic something like this in excel and the rows can range from 30-50, so I'm thinking creating them as needed keeps the file size low.

[try67]

After declaring the i variable you need to use a loop to find out what is the latest set of fields that was created, and then add the next set after them.