We Keep Coding

Dynamic tables within tables do not preserve their values over a save / load

Using Livecycle Designer - now Adobe Experience Manager v 6.4.0.xxx, I'm trying to allow my users to create tables within tables in a form. I'm comfortable with non-nested tables - they work fine. The problem is that when I nest tables they lose information over a save. The first row is saved fine, but subsequent rows are not saved.
These are non-trivial tables. An outer row has, say 5 text fields, some radio buttons, subforms that hide/show based on logic, etc. The nested table only shows under certain logic - it also has multiple text fields and check boxes. However, I've simplified this down below - still fails.
Based on Nested tables in livecycle fall apart on email, I decided to toss out tables and nest subforms to gain the same look and feel as tables. Again, one 'table' built this way works fine, but the subsequent nesting breaks - in interesting/crazy ways - the subform nested in row one gets more rows (instanceManager.count) and subsequent rows lose their textfield information - but radio buttons keep their information.
What I've done
I've rebuilt using subforms over tables. No love, though interesting weirdness.
I've toggled the Form Properties / run-time / Preserve scripting changes to form when saved -- I want automatic but I've toggled to manual and back. (Per https://forums.adobe.com/thread/1281883)
I've monitored it as best I can - on preSave and postSave the information is there - on initialization it's gone.
Pre-Save
Post-Save Totally whacky. Kept second row (unlike tables) but lost the information in fields. First row somehow gained another nested row.
I call this from a button 'click'
function fAddSfRow(oSfTable) {
oSfRow = oSfTable.sfRow;
oSfRow.instanceManager.addInstance(1);
}
And, to remove a row - in another button 'click'
var oSfRow = $.parent;
if (oSfRow.instanceManager.count > oSfRow.instanceManager.occur.min ) {
oSfRow.instanceManager.removeInstance(oSfRow.index);
}
Example PDF
What I'd like is a nested table with text fields in each that saves/loads.
Thanks!!

Okay, the best answer I've found is...
Wrap only the table with inner tables with a 'pre-save' and 'initialize'.
Presave
Capture the number of total rows for the outer table
Capture the number of rows for each inner table
Capture the rawValue of each field
Store all this somewhere - say in a hidden text field
Initialize
Set table.row.instanceManager.count for outer table
Set table.row.instanceManager.count for each row of inner tables
Reset all rawValues for fields
do any logic for hiding/showing subforms or whatever
Ughh.

Hiding certain choices in a qualtrics matrix

I am very new to programming but have come across a situation in my work where I believe I need to use some javascript to make my survey manageable for the participant. The client wants to use Qualtrics as a scheduling system. Faculty identify time slots that they are available and the survey would start by hiding the ones that they will not be available for. Then dynamically hides buttons as the quotas fill for a given time slot.
My matrix table is 10 columns x 15 rows to accommodate all the times and days. I'm trying to reuse snips of codes that I have found online and so far have gotten to:
Qualtrics.SurveyEngine.addOnload(function()
{
$("QR~QID14~1~4").up().hide();
});
This is hiding a choice, but instead of row 1 column 4 it is hiding row 1 column 15 (whose inspect element is QR~QID14~1~10). Whatever I change my column number to (4 in the example) it is always hiding the check box in the last column. I don't understand what I am doing wrong. So I've gone into my results and realize it is hiding the correct button but the rest of the buttons are shifting left so it appears that the last button is hidden.
Once I get it to hide the correct column I want to add conditions to my code that will hide it based on the value of a quota, which I believe would look like:
Qualtrics.SurveyEngine.addOnload(function()
{
if ('${qo://QUOTAID/QuotaCount}' > 0) $("QR~QID14~1~4").up().hide();
});
Where I would find the QUOTAID via Qualtric's piped text option
I know I can format this as a list but there are too many options for some faculty to make that look right.

You want to hide the contents of the table cell, not the cell itself.
Qualtrics.SurveyEngine.addOnload(function() {
$('QR~QID14~1~4').up('td').childElements().invoke('hide');
});

adding rows inside grid extjs

I am trying to add rows dynamically inside a grid using a button and remove individual rows using an action column function. I have two text fields (name, email) inside the grid on each row. So when the user hits the add button, a new row should appear with name and email fields. The third column would be an action column and when the button in the action column is clicked the entire row should be removed.
It would greatly help me out if somebody could share some sample code for me to get started.

There are some great code examples in the docs. This is where you have to head first, before asking here.
Look at this row editing example.

suggestions to show/hide columns / row sorting / fixed headers in a large data table with jquery

I have a very big table filled with data
1st - i want to use show/hide columns:
the problem is when my columns pass 10-12 to more it got really slow
for this i gave each a class for the column it is in and call it
for toggle with assocciated anchor().
2nd & 3rd - i want to use fixed headers as my row go way more than 1000's,
as i do this i can not effectively use my search which i wrote it with js
and really is a lightweight code.
PS. plz remember i have a very large json generated table with more than 20 columns and way more than 1000's of rows and i ** CANT USE ANY FRAME WORKS EXCEPT JQUERY AND JQUERYUI **
EDIT: ADDS SOME CODE FOR SHOW/HIDE
$('#columnSelect').on('click', 'li', function(){
var columnTmp = $(this).children('a').text()
$('#dataTable').find('.'+columnTmp).toggle()
})
i have a list of my tags which is also created dynamically with my first ajax call
i got the text of anchor and match it with
then toggle that column tds

I use a combination of two plugins for some of my "large tables"
This is used to format the table, provides sorting and other functionality:
http://www.tablefixedheader.com/fullpagedemo/
And, this provides filtering, this is fast and very effective, it may well help if you have a lot of columns/data. Have a search box or drop down discretely at the top of each column which will allow for filtering on that column and a "quick find" type search box which will search/filter across all columns
http://www.picnet.com.au/picnet-table-filter.html

If you are really jQuery lover then I suggest to go with some free jQuery Grid APIs such as Slick Grid or Flexi Grid

SlickGrid V2.0 Column name/id does not follow column when dragging

I have an application (using SlickGrid) where I need to get the column name or id at any time when user clicks on a cell (this pulls up a menu specific to the data in that column/cell). Grid works fine initially but if the column is moved (drag/drop), the column name/id does not follow the drop but remains mapped to it's initial column position.
Has anyone else seen this and, if so, how did you fix it?
Thanks

Are you trying to reuse the list of columns defined in your html code? You should get the list of columns from the grid instead. The following code should do what you are expecting (i.e. printout the name of the column in which you clicked a cell):
grid.onClick.subscribe(function(e,args) {
var allColumns=grid.getColumns();
console.log(allColumns[args.cell].name);
});
You can add that code in one of the examples provided with the source code (say "example3-editing.html"), drag-drop some columns around and check the console after clicking on a cell.