Form Help

TOPIC:

Check Boxes customization 8 months 4 weeks ago #280727

  • RedStar's Avatar Topic Author
  • RedStar
  • Offline
  • Senior Member
  • Senior Member
  • Registered
  • Posts: 82
  • Thanks: 4
Hello everyone, hello the BF team!


I need a solution for customizing the check boxes in BF.

For each element (group of checkboxes) I has added 3 check box types, respectevely named "FC", "N/A" and "Finding" (see screenshot attached).

Is it possible to have the first checkbox (when checked) in green, the second one (when checked) in yellow and the third (if checked) in red? I guess that some tricks should exist and a script can be added in "Before the Form" and "After the Form" advanced fields?!


Thank you in advance.

Best Regards,

Max.
Attachments:

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

Check Boxes customization 8 months 3 weeks ago #280924

  • RedStar's Avatar Topic Author
  • RedStar
  • Offline
  • Senior Member
  • Senior Member
  • Registered
  • Posts: 82
  • Thanks: 4
Hello.

Anyone has the idea how to implement this feature?


Thank in advance.

Max.

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

Check Boxes customization 8 months 2 weeks ago #280926

  • Eddy.vh's Avatar
  • Eddy.vh
  • Offline
  • Platinum Member
  • Platinum Member
  • Registered
  • Posts: 1220
  • Thanks: 207
Hello.

To customize checkboxes, see an example here.

codepen.io/Eddy-vh/pen/LYROYWN

Regards
Eddy

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

Check Boxes customization 8 months 2 weeks ago #280929

  • RedStar's Avatar Topic Author
  • RedStar
  • Offline
  • Senior Member
  • Senior Member
  • Registered
  • Posts: 82
  • Thanks: 4
Hello Eddy.


Thanks for the custom code.

How can I transform it in JS? I thought that BF Form & Pieces was bulded to work with JS and PHP, right?


Currently I have the following customization in my Form Pieces - Before Form:

echo '
<style>
input[type=checkbox] {
transform: scale(1.2);
background-color: #eee;
}
</style>
';

echo '
<style>
input[type=radio] {
transform: scale(1.2);
background-color: #eee;
}
</style>
';


Is it possible to affect your code in BF and to customize each checkbox in BF separately (as per their color)? In my current BF form I have 3 checkboxes for each element.


Thank you in advance.

Max.

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

Check Boxes customization 8 months 2 weeks ago #280934

  • Eddy.vh's Avatar
  • Eddy.vh
  • Offline
  • Platinum Member
  • Platinum Member
  • Registered
  • Posts: 1220
  • Thanks: 207
Bonsoir Max.

Sauf erreur tu t'exprimes en français.

Un code similaire à mon exemple peut être ajouté à ton code présent dans la pièce avant formulaire.

Il faut adapter à ton besoin et à ton formulaire.

Un lien vers celui-ci ne serait pas superflu.

Bonne semaine.

Eddy

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

Check Boxes customization 8 months 2 weeks ago #280936

  • RedStar's Avatar Topic Author
  • RedStar
  • Offline
  • Senior Member
  • Senior Member
  • Registered
  • Posts: 82
  • Thanks: 4
Bonsoir Eddy!


Oui, je peux m’exprimer en Français; aucun souci.

J'ai bien vu votre code en HTML et en CSS. Ce que je n'arrive pas à appréhender c'est comment transformer le HTML+CSS en PHP ou le JS dans la pièce avant le Formulaire de BF...

Le code que j'ai donné précédemment c'est la customization que j'ai actuellement Pièces - Avant le Formulaire.

L'idée qu'il faut que je réalise c'est d'avoir 3 cases (checkboxes) normales et une fois l'une d'entre elles cochée - elle devra s'illuminer en couleur (vert si c'est la première case, bleu si c'est la deuxième et rouge dans le cas de la troisième). L'exemple que j'ai donné dans mon premier message de ce post.

Je mets en pièce jointe un extrait de ma forme avec les trois cases (en frontend) et en (backend).


J'espère que c'est un plus plus clair )


Encore merci et bon début de semaine à vous.

Maxime.
Attachments:

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

Moderators: ForumSupport
Time to create page: 0.079 seconds

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

Subscribe to news and updates!

Special Offer

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!

Live Support Chat Opened!

Join our Discord chat here and enter the Crosstec channels to receive live support and talk directly to the team!