staggering the rows of a repeating section

[istuart]

I have created a dialog component with a repeating section. Within the repeating section I have a text area. I want the text area in the odd rows of the repeating section to be left justified in the div and the even rows to be right justified to give the feeling of a text message layout.

A previous forum thread mentions conditional formatting for repeating sections, but I don't see that option in the properties for V11.

Has anyone done something similar? Your help is appreciated.

[Pat Bremkamp]

Re: staggering the rows of a repeating section

I've never tried this in a repeating section, but it works in other areas:

Set up two different fields, one for person_1 and one for person_2. Set 1 with a right margin of, say 20px and 2 with a left margin of 20px. You can also set the backgrounds to diffent colors so it looks even more like a text message. Put the fields next to each other and "merge" them into one field. Then set the show hide based on the person. If person_1 set show on field 1 and if person_2, set show on person_2.

This has the advantage that, if person_1 does two messages in a row, they will both be left aligned.

[istuart]

Re: staggering the rows of a repeating section

Thanks for responding, Pat. That's a creative solution. I like the idea of having two different colors for the different users. My component will potentially have more than 2 users entering data into the repeating section, so I wanted to stagger them to at least show different entries.

Since I posted, I wrote a jQuery function that finds the even rows. Looking at the raw Xbasic code, I saw that the html div for each row of the RS is dynamically built:

id="{dialog.componentName}.V.R1.REPEATINGSECTIONNAME.I[instanceNumber]

In the afterRptSectionRowAdd and onRenderComplete sections, I use the instance number in a jQuery function:

jQuery("#DLG1\\.V\\.R1\\.REPEATINGSECTIONNAME\\.I2").css("margin-left","50px");

Note the double backslash on the period. This took me a while to figure out, but you need two because the second backslash escapes the first, which escapes the period. Tomorrow I plan on extending the function to dynamically recognize the instance number as even.