TOPIC:

how to achieve this form process 4 years 1 month ago #206383

  • Topic Author
  • linghun
  • Offline
  • Senior Breezer
  • Senior Breezer
  • Posts: 135
  • Thanks: 0
tabs or menus link to form pages, how to do that.
Attachments:

Please Log in or Create an account to join the conversation.

how to achieve this form process 4 years 1 month ago #206472

  • Tihomir's Avatar
  • Tihomir
  • Offline
  • User is blocked
  • User is blocked
  • Posts: 3564
  • Karma: 87
  • Thanks: 288
Hi,

here's an example of how you can do it by using jquery.

Follow these steps:

1) go to your form > advanced > choose a theme engine "bootstrap"

2) go to your form > advanced > more options > scripts > Initialization Script > click on the custom radio button > once you created a code framework , put the following code into the main function :
JQuery('#bfPage1').prepend('<ul class="nav nav-tabs"> <li class="active"> <a href="#" onclick="ff_switchpage(1);">Page 1</a> </li><li><a href="#" onclick="ff_switchpage(2);">Page 2</a></li><li><a href="#" onclick="ff_switchpage(3);">Page 3</a></li><li><a href="#" onclick="ff_switchpage(4);">Page 4</a></li></ul>');

JQuery('#bfPage2').prepend('<ul class="nav nav-tabs"> <li> <a href="#" onclick="ff_switchpage(1);">Page 1</a> </li><li class="active"><a href="#" onclick="ff_switchpage(2);">Page 2</a></li><li><a href="#" onclick="ff_switchpage(3);">Page 3</a></li><li><a href="#" onclick="ff_switchpage(4);">Page 4</a></li></ul>');

JQuery('#bfPage3').prepend('<ul class="nav nav-tabs"> <li> <a href="#" onclick="ff_switchpage(1);">Page 1</a> </li><li><a href="#" onclick="ff_switchpage(2);">Page 2</a></li><li class="active"><a href="#" onclick="ff_switchpage(3);">Page 3</a></li><li><a href="#" onclick="ff_switchpage(4);">Page 4</a></li></ul>');

JQuery('#bfPage4').prepend('<ul class="nav nav-tabs"> <li> <a href="#" onclick="ff_switchpage(1);">Page 1</a> </li><li><a href="#" onclick="ff_switchpage(2);">Page 2</a></li><li><a href="#" onclick="ff_switchpage(3);">Page 3</a></li><li class="active"><a href="#" onclick="ff_switchpage(4);">Page 4</a></li></ul>');

The code above refers to the form with 4 pages , in case you want to extend it , copy the following part of the code :
JQuery('#bfPagePAGENUMBER').prepend('<ul class="nav nav-tabs"> <li> <a href="#" onclick="ff_switchpage(1);">Page 1</a> </li><li><a href="#" onclick="ff_switchpage(2);">Page 2</a></li><li><a href="#" onclick="ff_switchpage(3);">Page 3</a></li><li ><a href="#" onclick="ff_switchpage(4);">Page 4</a></li></ul>');


Just pay attantion to put the right number of page instead of "PAGENUMBER", also to active correct tab for that page. class="active"

Let me know if you need further help to impelement this example.

Kind regards,
Tihomir
===============================================
Support Crosstec and get ALL EXTENSIONS and professional support for just $5
Here!
===============================================
Regards
Tihomir
==========================================
+++ Purchase Professional Support: crosstec.org/en/support/purchase-additional-support.html +++

Please Log in or Create an account to join the conversation.

Last edit: Post by Tihomir.

how to achieve this form process 4 years 1 month ago #206587

  • Topic Author
  • linghun
  • Offline
  • Senior Breezer
  • Senior Breezer
  • Posts: 135
  • Thanks: 0
do you mean i need to write tabs code , then put the tabs code and the form in an article???
i don't know how to write the tabs code ,can you give me??

Please Log in or Create an account to join the conversation.

how to achieve this form process 4 years 1 month ago #206601

  • Tihomir's Avatar
  • Tihomir
  • Offline
  • User is blocked
  • User is blocked
  • Posts: 3564
  • Karma: 87
  • Thanks: 288
Hi,

I described you all the procces you should follow. If you want, I can send you a basic form of using that code?

Kind regards,
Tihomir
===============================================
Support Crosstec and get ALL EXTENSIONS and professional support for just $5
Here!
===============================================
Regards
Tihomir
==========================================
+++ Purchase Professional Support: crosstec.org/en/support/purchase-additional-support.html +++

Please Log in or Create an account to join the conversation.

how to achieve this form process 3 years 7 months ago #224678

  • ToddNS
  • Offline
  • Junior Breezer
  • Junior Breezer
  • Posts: 39
  • Thanks: 0
I have tried this and followed the directions precisely, however when clicking on "Page 2" tab the results show the content of my form's page 2 for a split second and then refreshes to show the homepage of my website.

I have a QuickTime recording of this situation and was wondering if there was either a way to upload this weird and wonderful situation or a method to attach a link to the website.

Please Log in or Create an account to join the conversation.

  • Page:
  • 1
Moderators: ForumSupport
Time to create page: 0.052 seconds

BreezingForms Pro 1.4.7 for WordPress Released!

Available in the membership section.

September Discount!

Massive discounts on all subscriptions!

Get Your Subscription Here

Quick Links

Downloads

BreezingForms

ContentBuilder

BreezingCommerce

Templates

Documentation

BreezingForms

ContentBuilder

BreezingCommerce

Apprendre BreezingForms (French Community)

Apprendre et maîtriser BreezingForms par des tutoriels et exemples, le tout en français

breezingforms.eddy-vh.com

Questions et réponses sur les forums de l'AFUJ

AFUJ

Special Offer

Summer Sale! All subscriptions at a special price!

Includes prio support, all of our current and future Joomla!® extensions and Joomla!® templates for the duration of your membership.

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!