Repeating Group Loading Elements Out of Order

[sgorney]

Hey guys:

I have a repeating group that has several elements. They are set up like this:

DBJoin 1 - Dropdown [Parent]
-Loads a list of DB Records
-value = id of record
-label = name of record

Several DBJoins (about 15) - Checkbox [Child]
-loads a list of DB Records
-value = id of record
-label = name of record
-parent id = id from the DBJoin 1

--

On DBJoin 1 there is a set up javascript elements that hides all child elements, and only shows them when the parent is selected.

This all works great, but I want to be able to add multiple selections, so I was hoping to have this group be repeatable. However when I turn on repeating groups and add to the group, the elements display out of order. I looked at the CSS and this doesn't seem to be a CSS issue, it appears that the HTML is actually loading out of order.

Attached are some screenshots, and here's a link to the form:
http://kiconnections.net/form.html\

Any ideas on how to fix this?

 

[sgorney]

Friendly bump on this

 

[cheesegrits]

I'm working on replicating this locally.

-- hugh

 

[sgorney]

Did you make any progress on this Hugh?

 

[cheesegrits]

Not yet. Your site is exhibiting behavior I don't seem to be able to replicate. And with Rob away most of this week, I kind of ran out of time trying to debug your site.

Can you bump this on Monday or Tuesday?

One of the issues is, you have so many JS actions that it's hard to tell what's going on.

You may want to consider replacing all those individual JS actions with a custom function, which will make life easier in the long run.

-- hugh

 

[sgorney]

I will look into rewriting the actions into a JS file to make that easier for you.

-Chad

 

[sgorney]

Hey Hugh:

A note on this. If I remember correctly from the fabrik 2.0 days, when you have JS that works with repeating groups and JS that there is an issue with the JS and the new element names. Is that the case with 3.0?

Assuming that I put together a show-hide script in JS that does something like:

onLoad() {
$('child1').setStyle('visibility:none');
...repeat for all my "child values"
}

function showHide() {
var parentCat = $('parentCatElementId').value();

if (parentcat == "value1") {
$('child1').setStyle('visibility:visible')
}
--repeat for all my child elements
}

Now the problem with the repeated groups (if I'm thinking far enough ahead) is that we'll end up with element names like:

repeat1_parentCategory
repeat1_childCategory

Etc... will I need to come up with a method to append to the names each time the repeat button is hit?

-Chad

 

[rob]

take a look at http://fabrikar.com/wiki/index.php/Form_and_element_javascript for info on how to get all the repeat group's element