Expand my Community achievements bar.

Guidelines for the Responsible Use of Generative AI in the Experience Cloud Community.

Add table rows to top of form

Avatar

Former Community Member
New user to Designer 8 (sorry if this has been posted before), have created a form with a flowed table that adds one row to bottom of the form each time a button is clicked. This form will continue to add rows indefinitely, so would like to add rows to TOP of the table. Here's the Javascript I'm using to add the row:






Table1.instanceManager.addInstance(true); // Default instance manager syntax



Table1.Row1.instanceManager.addInstance(true); // Default instance manager syntax



xfa.form.recalculate(true); // Invoke the recalculate method to include the field values from the added table or row in the form calculations.


16 Replies

Avatar

Former Community Member
You need to use the moveInstance method after you have created the new instance to move it from the last position (which is the the "length" of your repeating node - 1) to the top position (which is "0"). See "Manipulating instances of a subform" at the back of the Designer Scripting Reference for some examples.

Avatar

Former Community Member
Hi Claudia,



You can use the insertInstance() method to insert a row at the top of the table. For example:



Table1.Row1.instanceManager.insertInstance(0, true);



The first parameter is an integer indicating the zero-indexed position to insert the row instance. The second parameter is a Boolean indicating if data should be merged with the new row instance.



For more information, have a look at the Adobe XML Form Object Model Reference, page 347. The guide is posted here:



http://www.adobe.com/devnet/livecycle/articles/Adobe_XML_Form_Object_Model_Reference.pdf



Note: this method was introduced in version 8.0.



Regards,



Hélène

Adobe Systems

Avatar

Former Community Member
This works great until it gets to end of the first page--a blank row is added to the top of the page on click of button. However, after page end, previous rows are repeated sequentially at top of the page each time button is clicked, and new rows are added at beginning of the form. Here's my script:




Table1.instanceManager.insertInstance(0,true);



xfa.form.recalculate(true);


Avatar

Former Community Member
Must be doing something wrong here, as rows are still being added to the bottom of my form:




Table1.instanceManager.addInstance(true);



Table1.Row1.instanceManager.moveInstance(1,0);



xfa.form.recalculate(true);


Avatar

Former Community Member
Claudia,



First, as of version 8.0, you dont need to explicitly recalculate the form. It is done automatically.



Second, the following script will always add a row at the top of the table:



Table1.Row1.instanceManager.insertInstance(0, true);



Now based on your comment, it sounds like you want to add the row at the top of the current page. Is that correct?



As for your script:



Table1.instanceManager.addInstance(true);

Table1.Row1.instanceManager.moveInstance(1,0);



On line 1, you are adding an instance of the table.

On line 2, you are attempting to move an instance of the row.

You want to add an instance of the row before moving it. Replace line 1 with:



Table1.Row1.instanceManager.addInstance(true);



Cheers,



Hélène

Adobe Systems

Avatar

Former Community Member
Helene - Can you provide an example of how to insert a row between others? I have 5 rows and each have their own add & delete buttons. If I'd like to generate a new row under Row 2, when I click Row 2's "add" button, it places it below Row 5.

My table is only allowing me to add rows either at the very top or the bottom, not in-between like I need.

Avatar

Former Community Member
I was able to figure this out and got it to function as I need, using the below script on my "add" button:



var oSubform = this.resolveNode("Row1");

var oNewInstance = oSubform.instanceManager.addInstance(1);

var nIndexFrom = oNewInstance.index;

var nIndexTo = this.parent.parent.index + 1;



// Invoke the instanceManager to insert the subform below the current one.

oSubform.instanceManager.moveInstance(nIndexFrom, nIndexTo);



This now allows me to insert a row directly below the row I select.

Avatar

Level 1

GPayne,

I know this is a long shot since this post is pretty old but I wanted to see if you had a sample of adding rows in between that you could post or send to me.  I tried your code and I get nothing...

TIA.

Avatar

Former Community Member
Hi

using the above script has solved a problem I was having with my form adding a row to the wrong place, but now my delete row button isn't working.



Does anyone have an idea what the script would be for delete row?



Thanks

Amy

Avatar

Former Community Member
Amy - Try using the below, for delete:



var nNumRow = 0;

var nTableLength = Table1.nodes.length;

for (var nCount = 0; nCount < nTableLength; nCount ++) {



if ((Table1.nodes.item(nCount).className == "subform") & (Table1.nodes.item(nCount).name !== "HeaderRow")) {

nNumRow = nNumRow + 1;

}

}

nNumRow = nNumRow - 1;

if (nNumRow < 10) {

xfa.host.messageBox("The minimum allowable number of rows is 10. You cannot remove any more rows.", "Warning", 3);

}

else {

Table1.Row1.instanceManager.removeInstance(1);

}

Avatar

Former Community Member
Thanks for getting back to me Gretchen.

Using that I just seem to get an error message about not enough rows, even when I change (nNumRow < 10) to (nNumRow < 1)



The below works:



var oSubform = this.resolveNode("Row1");

var oNewInstance = oSubform.instanceManager.removeInstance(1);



Except it always removes the second row regardless of which row you click delete in.



Thanks for any help you can give with this

Amy

Avatar

Former Community Member
Amy - are you looking to remove SPECIFIC rows? If so, use the below script:



if (Table1.Row1.instanceManager.count > Table1.Row1.instanceManager.occur.min) {

Table1.Row1.instanceManager.removeInstance(parent.parent.index);

}



Otherwise, what you need to do for the previous script I posted, is designate your removal row (the above says "Table1.Row1") to say something like:



Table1.Row[*].instanceManager.removeInstance(1);



It needs to match up to however your row is named, otherwise, it will continue removing the "Row1" it is designated. If you're still having troubles, you can email me directly at: gretchen.payne@wch-rcc.com

Avatar

Former Community Member
Hi:),I used the script above, it works fine until i saved the form(i have adobe LiveCycle Reader Extensions), when re-opening the form, only the first row was there, seems like the multiple instances cannot be held...

does anyone know what i am supposed to do with this issue? thx in advance!!!

Avatar

Former Community Member
Amy - I lost your email...so hopefully you'll get this post.

The only workaround I could come up with for making the row/subform add/delete options work is by adding a "Delete Section" button below the "Add Section" button. That way, it adds/deletes the sections that are added.

I cannot come up with a script that allows the "Delete Rows" buttons to delete BOTH/EITHER the subform or the row.



Feel free to email me again...I can send you the fixed file I made.

Avatar

Former Community Member
Jing Li - Have you ensured that your form is saved 8.0 dynamic?

Avatar

Former Community Member
I am also having issues with positioning rows using scripts. I would like users to be able to add rows for expense categories, and then add rows directly beneath those categories for subcategories. I do not know how to script the behavior to position each "category row" after the "subcategory rows" that have been added for the previous category. I am attempting to do this with two sets of add/remove buttons.



Any suggestions?



Example

[Add Category]



[Row 1] Salaries & Wages | $100K | Add SubItem - Yes

[Row 2] Program Director | $80K | Add Additional SubItem - Yes

[Row 3] Program Administ | $20K | Add Additional SubItem - No

[Row 3] Travel | $40K | Add SubItem - No

[Row 5] Fringe Benefits | $30K | Add SubItem - No