• Hello Fabrik Community

    Fabrik is now in the hands of the development team that brought you Fabrik for Joomla 4. We have recently transitioned the Fabrik site over to a new server and are busy trying to clean it up. We have upgraded the site to Joomla 4 and are running the latest version of Fabrik 4. We have also upgraded the Xenforo forum software to the latest version. Many of the widgets you might have been used to on the forum are no longer operational, many abandoned by the developers. We hope to bring back some of the important ones as we have time.

    Exciting times to be sure.

    The Fabrik 4.0 Official release is now available. In addition, the Fabrik codebase is now available in a public repository. See the notices about these in the announcements section

    We wish to shout out a very big Thank You to all of you who have made donations. They have really helped. But we can always use more...wink..wink..

    Also a big Thank You to those of you who have been assisting others in the forum. This takes a very big burden off of us as we work on bugs, the website and the future of Fabrik.

[solved] Custom form templating issues

aijosh

Member
I need to place elements side by side.

1 | 5
2 | 6
3 | 7
4 | 8


HTML:
<div class="row-fluid">
<div class="span6">
element 1,2,3 & 4
</div>
<div class="span6">
element 5,6,7 & 8
</div>
</div>

Option 1:
change element ordering in fabrik form's list to 1,5,2,6,3,7,4,8 and use float:left;
Issue:
when on mobile, the ordering doesn't make sense since its shown 1s
1
5
2
6
3
7
4
8

Option 2:
create custom template (allow elements to be automatically generated in foreach)
Issue:
the elements re generated in 'foreach'. I wouldn't know how to break them into two columns

Option 3:
create custom template( manually generate elements)
Issue:
was already through with this when I found out the elements didn't generate all the necessary content required for the form to work. no id's e.t.c. form's javascript also not working.

Any suggestion?
 
Last edited:
Edit: easier way

Create two groups, for elements 1-4, 2-8
This will give you 2 div with id=groupX

Then you can add CSS to put the DIVs side by side (float or flex) resp. one after the other for mobile (with mediaqueries).
Or create a custom template to output the groups by adding e.g. span6 (in default.php split the groups' foreach)

If you want to have the complete form functionality you must keep the "Fabrik structure" (div containers, ids, classes, attributes etc).
 
Last edited:
Thanks,

I actually initially attempted this. But I already have so many list and list joins I'm a little wary of messing up stuff.
I did create another group (ListB section1) then tried to copy the first 4 elements of List B into this group. At this point I was getting a message that the elements already exist with the option to rename the elements. So I stopped here. Cos I believe renaming the elements would break the relationships between the elements and also the form (I don't know the inner working of that yet and was not willing to risk it)

I was able to use your first suggestion and I think I prefer that. Worked seamlessly (finished in less than 15mins). Wish I knew what exactly the foreach statements outputted, it would have saved me the whole night I tried getting this to work.
 
We are in need of some funding.
More details.

Thank you.

Members online

Back
Top