over Formular a bar to show on which side of how many

  • C3zehn
  • C3zehn's Avatar Topic Author
  • Offline
  • Senior Boarder
  • Senior Boarder
  • Posts: 74
  • Thank you received: 1

C3zehn created the topic: over Formular a bar to show on which side of how many

Hello,

I would like to have a bar at my form above where it indicates to me Page 1 of 5 when I go to the next page Page 2 of 5 as an example if the user is finished I would like to have a PDF that is all that is in the form is summarized is this possible?
Thank you
Andy
#235214
Attachments:
  • Posts: 5591
  • Karma: 118
  • Thank you received: 512

MarioPuco replied the topic: over Formular a bar to show on which side of how many


Satisfied with our Support ?
PayPal Tip
===============================================
Need to renew Pro Support?
Buy Here!
===============================================
Satisfied?
Consider a membership!
===============================================
Like us on Facebook
===============================================
#235225
  • Posts: 109
  • Karma: 1
  • Thank you received: 10

Eddy.vh replied the topic: over Formular a bar to show on which side of how many

Hello.

Mario's link leads to a forum discussion where the populated code does not work because it uses <a href="#"...> which then redirects to the site's homepage. It is better to use a code like the following, no link, no redirection, just a passage from one page to another.
It remains to format the style of the list at the top of the page using CSS
function ff_FormName_init()
{
JQuery('#bfPage1').prepend('<ul class="marker"><li class="active"><span onclick="ff_switchpage(1);">1</span></li><li><span onclick="ff_switchpage(2);">2</span></li><li><span onclick="ff_switchpage(3);">3</span></li><li><span onclick="ff_switchpage(4);">4</span></li></ul>');

JQuery('#bfPage2').prepend('<ul class="marker"><li><span onclick="ff_switchpage(1);">1</span></li><li class="active"><span onclick="ff_switchpage(2);">2</span></li><li><span onclick="ff_switchpage(3);">3</span></li><li><span onclick="ff_switchpage(4);">4</span></li></ul>');

JQuery('#bfPage3').prepend('<ul class="marker"><li><span onclick="ff_switchpage(1);">1</span></li><li><span  onclick="ff_switchpage(2);">2</span></li><li class="active"><span onclick="ff_switchpage(3);">3</span></li><li><span onclick="ff_switchpage(4);">4</span></li></ul>');

JQuery('#bfPage4').prepend('<ul class="marker"><li><span onclick="ff_switchpage(1);">1</span></li><li><span  onclick="ff_switchpage(2);">2</span></li><li><span onclick="ff_switchpage(3);">3</span></li><li class="active"><span onclick="ff_switchpage(4);">4</span></li></ul>');
} // ff_FormName_init

I attach an example form as an attachment.

File Attachment:

File Name: Package_Sa...orms.zip
File Size:8 KB
#235249
Attachments:
  • C3zehn
  • C3zehn's Avatar Topic Author
  • Offline
  • Senior Boarder
  • Senior Boarder
  • Posts: 74
  • Thank you received: 1

C3zehn replied the topic: over Formular a bar to show on which side of how many

Hello
my problem is the beam as well how do i get this?
#235257
Attachments:
  • C3zehn
  • C3zehn's Avatar Topic Author
  • Offline
  • Senior Boarder
  • Senior Boarder
  • Posts: 74
  • Thank you received: 1

C3zehn replied the topic: over Formular a bar to show on which side of how many

Hello
my problem is the beam as well how do i get this?
#235258
  • Posts: 109
  • Karma: 1
  • Thank you received: 10

Eddy.vh replied the topic: over Formular a bar to show on which side of how many

Hello.

With a little css.
The following styles are valid for the code I provided above.
Just paste it at the end of the file /media/breezingforms/themes/nameOfYourTheme/theme.css
/* PAGE MARKER AVEC LISTE DE CHANGEMENT DE PAGE */
.bfQuickMode ul.marker {
  display: flex;
  list-style: none;
  justify-content: space-evenly;
  padding: 0;
}
.bfQuickMode ul li {
  flex: 1 1 auto;
  position: relative;
  text-align: center;
  transition: 0.3s;
}
.bfQuickMode ul li span {
  display: inline-block;
  height: 35px;
  width: 35px;
  line-height: 32px;
  background: deepskyblue;
  border: 2px solid deepskyblue;
  border-radius: 50%;
  transition: 0.4s;
}
.bfQuickMode ul li span:hover {
  cursor: pointer;
  background: #99e5ff;
}
.bfQuickMode ul li span:before, .bfQuickMode ul li span:after {
  content: "";
  position: absolute;
  display: inline-block;
  width: 50%;
  height: 2px;
  background: deepskyblue;
  top: 50%;
  left: 0;
  z-index: -1;
}
.bfQuickMode ul li.active span {
  background: #99e5ff;
}
.bfQuickMode ul li:not(:last-child) span:after {
  left: 50%;
}
.bfQuickMode ul li:first-child span:before, .bfQuickMode ul li:last-child span:after {
  height: 0;
}

Good luck.

Regards
#235285
The following user(s) said Thank You: MarioPuco
Moderators: ForumSupporttomeperica
Time to create page: 0.332 seconds

Community Reward

Help us to create new extensions and plugins! With only $5 you help us a lot and get unlimited download access to all of our products, professional support and even more. Get your reward now!

Read More Here

News and Updates

Get informed about new downloads, updates and more in our News and Updates newsletter.

All Extensions Subscription

Get 1 year access to all of our current and future products and 1 year of professional support -- 99€

No support per domain or website installation limits! Includes all of our current and future Joomla!® extensions, Joomla!® templates for the duration of your membership. This means, by purchasing an All Extensions Subscription you'll have it all covered!

Get it from here

3rd Party Discount - 25% Off

We help you to keep your costs under control. If you are a new member and purchased a form building tool from a different form vendor, then you'll get a 25% discount on our subscription plans.

How to receive the discount:

Send us a quick email to sales@crosstec.org with a proof of purchase (for example a paypal receipt), await payment instructions and enjoy your membership!

Community Reward

Help us to create new extensions and plugins! With only $5 you help us a lot and get unlimited download access to all of our products, professional support and even more. Get your reward now!

Read More Here