Help Needed with Setting up MIGx for an Accordion Panel

I'm stumped on one aspect of setting up MIGx for use with an accordion panel. There are two parts that I don't know how to construct. Each panel has a named anchor and a div with an id. How would I go about construction this portion in MIGx such that when the panel order is rearranged in the MIGx TV, those panel numbers change as well? Example: If I decided to move panel4 to be panel1, it's anchor & id becomes panel1. Same thing if I insert a new panel, a new number is generated, and all other panel numbers shift accordingly.

The chunk for each panel content is below. Trying for figure out how to set up the placeholder for the "#panel1", and the id="panel1





I guess I could also just use a placeholder for the numeral and hard code the text for the #panel and panel. But how do I get MIGx to auto insert the number and / or change that number to match it's position in the MIGx form?
a href="#panel[[+placeholderForNumber]]"
id="#panel[[+placeholderForNumber]]"

I found one post where it seemed as though the person had the ah-ha moment, figured it out, but never actually posted the final code. In that post..Bruno says: "A MIGX-id of a MIGX-item should never change its value. (Same as you would have records in a table with an autoincrementing primary key) If you need an idx starting from 1 when listing MIGX-records, use [[+idx]]"

So my question from a barely knowing enough to be dangerous perspective: What am I trying to do? What is the correct way to phrase the question for obtaining the solution.

Each item that gets created in MIGx, using Add Item, should be assigned a number — starting at 1
Those numbers should change whenever the item order is changed in the MIGx form. (whatever is in position 1 gets number 1, whatever is in position 2 gets number 2 and so on
Whatever that number is should then appear in the placeholder in my chunk source code (example: panel[[+number]]




[ed. note: mmcgee last edited this post 11 years, 10 months ago.]

This should do the job

You may need to modify that <a> tag to use a full or at least an absolute URL.

Hi Susan: Thanks for confirming. I took a chance and was just testing to see if inserting [[+idx]] work. My accordion is not displaying on the page, so I must have a misnamed a chunk or something.
Thank you.

It should work. Test it by just putting [[+idx]] in the tpl somewhere. It that's working as expected, then it's something else.

I think the a tag is more of an anchor tag so I should be OK. I believe its used for the purpose of setting a link on the tab for toggling the panel open and closed. Also, with the js I have it also will scroll the open content in to view rather than just allowing it to flow off the bottom of the browser window.

Quote from: sottwell at Nov 22, 2014, 07:21 AM

It should work. Test it by just putting [[+idx]] in the tpl somewhere. It that's working as expected, then it's something else.

I am rechecking my code. I'm sure it is something simple I overlooked. Will know shortly.

I looked at the source code and voila! The [[+idx]] works! Content that I entered for the panel title and panel description is there in the source code, but the panel itself is not displaying.
Could be because I already have an accordion on the page that I hard coded in the chunk. Maybe a conflict having two on the same page if I don't give them a unique id.

That was it. I removed my hard coded version and now the MIGx accordion appears on the page. Hooray!. Thanks Susan.

At some point I may need to resolve mulitple accordions, but for now, I think there will really only be one on any given page. I'm still trying to get the hang of MIGx. I was able to get Redactor to work in MIGx and not that the numbering is figured out — thanks to you — I feel like I am doing OK. Still much to learn though.

I think the one thing I do get puzzled about is that there are always 2 TVs for my MIGx. One for the MIGx content, and one to display it on the page. Maybe that's the way it should be. I mean, if MIGx were set to display on a page "if" it contained content, that would be great. Then again, "if" I wanted to hide that content for some reason, the only way to do so would be to delete the content. So I guess 2 TVs are better than 1.

MIGx comes with a bunch of snippets. They aren't well-documented, but maybe if you look them over you'll find some that suit your needs.