MyBB Community Forums

Hi, I am [still] trying to add expand/collapse buttons to a form, so that the user filling it out, can collapse any sections that are irrelevant to them.

I have gotten the Form Creator plugin installed, but my issue is related to the template.

I have tried following the advice in this topic.. and it still did not work.

https://community.mybb.com/thread-136165.html

I have even tried following the advice given in response to my post in this thread, and that still did not work.

https://community.mybb.com/thread-209633...62460.html

I have been constantly working on this for the past 2 months and I am still unable to make this work.

I am doing this on behalf of a business, and so, it is extremely important that I am able to get this working.

I am not a coder, (nor do I have the time to learn how to code) and I have no experience with coding, but this seems like it would be simple to do.

Normally, I'd be able to find an alternative solution, or just give up on it, since the questions I've asked previously, has seemingly stumped even the most experienced of MyBB support staff, (since the topics get tons of views, but no replies,) but unfortunately, that is not an option for me and I am desperate for help on this.

Please, please, please help me.

Thank you.

Can this issue be fixed? It's been 3 days, and not a single reply, but thousands of views, is this issue really that impossible to fix?

The forum isn't open, and so, I can send my url via pm if need be..

<form id="myform_001" action="somepage.php" method="post">
	<table border="0" cellspacing="{$theme['borderwidth']}" cellpadding="{$theme['tablespace']}" class="tborder">
		<thead>
			<tr>
				<td class="thead{$collapsedthead['myform_001']}">
					<div class="expcolimage"><img src="{$theme['imgdir']}/collapse{$collapsedimg['myform_001']}.png" id="myform_001_img" class="expander" alt="{$expaltext}" title="{$expaltext}" /></div>
					<div><strong>{$lang->myform_001_title}</strong></div>
				</td>
			</tr>
		</thead>
		<tbody style="{$collapsed['myform_001_e']}" id="myform_001_e">
			<tr>
				<td>
					<!-- form inputs go here -->
					<label for="fname">First name:</label><br>
					<input type="text" id="fname" name="fname" value="John"><br>
					<label for="lname">Last name:</label><br>
					<input type="text" id="lname" name="lname" value="Doe"><br><br>
				</td>
			</tr>
			<tr>
				<td class="tfoot" style="text-align: right">
					<input type="submit" class="button" value="Submit">
				</td>
			</tr>
		</tbody>
	</table>
</form>

myform_001 is the identifier and should be different and unique for every single form.
There are 6 occurrences in the above given code, apart from the title language variable.

Edit: Apologies for late response. I understand your frustration. I just missed the thread. As I am the author of the main tutorial; you'd have sent me a PM or email to draw my attention.

Hi, thank you very much for the reply, and no worries on the late response, we all get busy from time to time, and I just got back from Ft. Lauderdale 2 weeks ago and just finished unpacking last week, so I understand completely.

I didn't want to bombard your thread for this code with my issues, and I didn't want to do the same to the Form Creator plugin topic for the same reason, and so I decided to start my own.

And I didnt want to run the risk of being banned or suspended for pming random people and bothering them about my issue.

I will pm you after this post..

Thank you again for the response, I really do appreciate it.

---

Where do I put this code? Do I put it in the templates for the form creator?

Hi, nearly 3 years later, I am STILL having trouble with this.. I had no choice but to move on to other stuff, but I am back on this because jotform sucks and user frustration over it will cost the business more clients than it brings in..

This is the default code for the header for the "formcreator_field_header" template for the Form Creator plugin..

<tr>
    <td class="thead" colspan="2">{$fieldoutput}</td>
</tr>

This is the default code for "the forumbit_depth1_cat" template.

<table border="0" cellspacing="{$theme['borderwidth']}" cellpadding="{$theme['tablespace']}" class="tborder">
<thead>
<tr>
<td class="thead{$expthead}" colspan="4">
<div class="expcolimage"><img src="{$theme['imgdir']}/{$expcolimage}" id="cat_{$forum['fid']}_img" class="expander" alt="{$expaltext}" title="{$expaltext}" /></div>
<div><strong><a href="{$forum_url}">{$forum['name']}</a></strong></div>
</td>
</tr>
</thead>
<thead>
<tr>
<td class="tcat" colspan="12">{$forum['description']}</td>		
</tr>
</thead>
<tbody style="{$expdisplay}" id="cat_{$forum['fid']}_e">
{$sub_forums}
</tbody>
</table>
<br>

Where in the code above (minus the forum name and description bits) would I put the "{$fieldoutput}" variable for this plugin, so that a user can collapse the sections that are irrelevant to them.

Let's say for example it is for a travel business, and a user wants to fill out the form for their vacation, but the want to omit cruises, so it'll be Car+Flight+Hotel package.. this user would want to collapse the Cruise section of the form, since they wouldn't need it.

How can I make it so that each section .thead, will be collapsible so that this user can fill out the parts they need without having to scroll down a huge form?

Your code looks like it is for a different form.. so I am not sure if it would work.

But when I tried to modify the forumbit code to make it work, it put a dead (no image uploaded but, clickable) icon above the .thead for the form itself and it collapsed the entire forum under the html header. I would like the expand/collapse icon to be on the .thead, in the corner, like it is now with the Quick Reply.

Give me your existing code for you to implement collapses and return you back.

I don't have an existing one, I had to change it back because the site is live and I didn't want to leave it as it was until I had something that worked..

It been a while since I posted this so don't remember how exactly I go the icon result.. so I tried to recreate it and this one has the icon show up where I want it to, but it only collapses the shoutbox.. and it dims the .thead where the icon was placed. It does not collapse the form. I would like to make the sections collapsible individually from each other..

<tbody>
<tr><td class="thead" colspan="2">
			<div class="expcolimage">
				<img id="inferno_img" class="expander" title="[-]" alt="[-]" src="images/collapse.png" style="cursor: pointer;">
			</div>{$fieldoutput}</td>
</tr>
<tbody style="{$collapsed['fieldoutput']}" id="fieldoutput">	
</tbody>

*edit 9:06 PM EDT*

I have sent you my link along with a test account and ACP pin.

The links to the forms, can be found in the forum descriptions in the form submissions category.
Thanks again for the help.