Buttons in footer section of "Partition area"

hwsassisi 11 Jun, 2017
Dear all,
I added 2 buttons in footer section of "Partition Area" with style "step" and sequencial "yes", but the don't move to the next or previous part of the partition area
Regards
hwsassisi 11 Jun, 2017
both buttons are standard buttons (not subit or reset).
First button has extra parameter as "class:backward"
Second button "class:forward" in extra parameter, but nothing happen clicking buttons

How to solve?
healyhatman 18 Jun, 2017
Following this thread because I also can't get the buttons to work.
Max_admin 18 Jun, 2017
Hi,

If you do not have the patch fixing the bug in the repeater in v6.0.5 then the repeater will not work, please pm me for the patch or send a message using the "Contact us" page.

Best regards,
Max
Max, ChronoForms developer
ChronoMyAdmin: Database administration within Joomla, no phpMyAdmin needed.
ChronoMails simplifies Joomla email: newsletters, logging, and custom templates.
healyhatman 20 Jun, 2017
1 Likes
After looking at the code, I have determined that the next/back event gets added to buttons by colour. So any button (of any type, submit or otherwise) anywhere in the partition (footer or part) gets assigned an action. Green buttons get turned into a next button, red buttons are back buttons. Until Max fixes that, just put a red button and a green button in the footer. Also still going to need the patch he sends you though.
har7801 10 Apr, 2018
Hi Chrono Team,

Having some similar issues, but more to do with the tab rendering of the Partition Area. I have 10 Tabs, In full wide screen they fit great, but in a smaller screen like a tablet they run off the page, in mobile they cascade vertically which is perfect. Can I force the cascade early or full time?

I got the forward and backward buttons in the footer working, although they don't let you skip through it you have a 'Required' Field and lock you in until its done. But it works for me, so I am using this in full screen mode to get through the pages.


Pic attached.

​[file=10388]Overrun.JPG[/file]
​[file=10389]Collapsed_-_Perfect.JPG[/file]
Thanks
har7801 10 Apr, 2018
Sorry, don't know how I spammed with the images!
healyhatman 10 Apr, 2018
EDIT: Wrong CSS, see further below for correct code.

Add custom CSS targetting the tabs

overflow: hidden;
overflow-x:scroll;

In that order.
har7801 10 Apr, 2018
Thanks for the awesome quick reply.

As a novice can you help me a little, where would I add the custom code function to? Into the Partitions Area in the designder tab, or into the Setup for the Display Section Tab.

Any help would be great.
healyhatman 10 Apr, 2018
Designer tab, custom -> CSS

This will mean that if the tabs run off the page you can scroll them to select the one you want
har7801 10 Apr, 2018
Ah got it, I think that is set up by default as I can get a scroll bar action at the base of the page.

I more want it to display all within the elements box. So if I can force it to cascade vertically the same as it does for mobile view then that would be great. As most of the inventory program I am writing if for tablet, some tablets are res between full screen and mobile, so a slide bar isn't the best option, especially from some of my less nimble fingered team members.
healyhatman 10 Apr, 2018
Dont need to touch the slide bar you can slide the tabs themselves.
har7801 10 Apr, 2018
Oh ok, sorry my bad, misunderstood.

I have dropped this in as written! Am I on the right page?[file=10390]Capture.JPG[/file]
healyhatman 10 Apr, 2018
EDIT: Wrong. See further below for correct CSS



Almosy. You need to target the tabs. Right click a tab header and go "inspect" and note the class of the parent <div>. Probably one of the classes is 'tabbed' I'm out at the moment so not sure.

In the CSS block then you need
.tabbed { overflow:hidden; overflow-x:scroll; }
har7801 10 Apr, 2018
Thanks,

I did an Inspect, got the following, for the whole <div> ' and this just for the menu tabs part 'ui top attached steps G2-tabs'ui container fluid partitioned'

Have tried both in the CSS.
.ui container fluid partitioned { overflow: hidden; overflow-x:scroll; }
but to no avail.

Thanks for the help.
healyhatman 10 Apr, 2018
OK now that I am home and can look at my form, I got it wrong.
div.ui.top.attached.tabular.menu { overflow:auto; overflow-y: hidden; }
har7801 10 Apr, 2018
Ok,

So here is where I am at,

Got the Custom Code in at the top of the 'Designer' tab.

Code in there is: (Dont forget the stops)
div.ui.top.attached.steps.G2-tabs { overflow:auto; overflow-y: hidden; }
The google inspect element gave me the <div> name. (As Attached)

Then the end result was a slider in the tab tabs bar that can be used to scroll through the tabs that are displayed. (As Pictured)

Buttons in footer section of


End result, healyhatman your a bloody legend. Winner.

Thanks for all your help.
This topic is locked and no more replies can be posted.