CiviCRM Community Forums (archive)

*

News:

Have a question about CiviCRM?
Get it answered quickly at the new
CiviCRM Stack Exchange Q+A site

This forum was archived on 25 November 2017. Learn more.
How to get involved.
What to do if you think you've found a bug.



  • CiviCRM Community Forums (archive) »
  • Old sections (read-only, deprecated) »
  • Developer Discussion (Moderator: Donald Lobo) »
  • Collapsible Fieldsets
Pages: [1]

Author Topic: Collapsible Fieldsets  (Read 4692 times)

emilyf

  • Ask me questions
  • ****
  • Posts: 696
  • Karma: 54
  • CiviCRM version: 2.x - 4.x
  • CMS version: Drupal 5, 6, 7
Collapsible Fieldsets
October 07, 2008, 10:31:40 am
OK, I must not have had enough coffee this morning. Can't turn up a search on this and my head feels fuzzy. All  i want to do is make communication preferences collapsed by default in my custom template file. I don't know why I can't figure this out, but if you help me I'll post this specific example on the wiki on the customizing screens page once and for all.

What of this code from the .tpl file would I need to change to get it to start out as collapsed:

Code: [Select]
<div id="commPrefs_show" class="section-hidden section-hidden-border">
  <a href="#" onclick="hide('commPrefs_show'); show('commPrefs'); return false;"><img src="{$config->resourceBase}i/TreePlus.gif" class="action-icon" alt="{ts}open section{/ts}"/></a><label>{ts}Communications Preferences{/ts}</label><br />
 </div>

<div id="commPrefs" class="section-shown">
 <fieldset>
  <legend><a href="#" onclick="hide('commPrefs'); show('commPrefs_show'); return false;"><img src="{$config->resourceBase}i/TreeMinus.gif" class="action-icon" alt="{ts}close section{/ts}"/></a>{ts}Communications Preferences{/ts}</legend>
  <div class="col1">
    <label>{ts}Privacy:{/ts}</label>
    <span class="font-red upper">
    {foreach from=$privacy item=privacy_val key=privacy_label}
      {if $privacy_val eq 1}{$privacy_values.$privacy_label} &nbsp; {/if}
    {/foreach}
    {if $is_opt_out}
      {ts}DO NOT SEND BULK EMAIL{/ts}
    {/if}
    </span>
  </div>
  <div class="col2">
    <label>{ts}Method:{/ts}</label> {$preferred_communication_method_display}
  </div>
  <div class="col2">
    <label>{ts}Email Format Preference:{/ts}</label> {$preferred_mail_format_display}
  </div>
  <div class="spacer"></div>
 </fieldset>
</div>

Dave Greenberg

  • Administrator
  • I’m (like) Lobo ;)
  • *****
  • Posts: 5760
  • Karma: 226
    • My CiviCRM Blog
Re: Collapsible Fieldsets
October 07, 2008, 10:52:09 am
Emily - This is a bit tricky because the collapse vs. expand states are controlled via showBlocks and hideBlocks arrays that are passed into a jscript function by the PHP code. However, you can hack it in your custom tpl by adding two additional lines which "reverse" the show and hide states for the 2 commPrefs div's:

Note the hide() and show() lines I've added to the existing init_blocks function in Tabbed.tpl below:

Code: [Select]
{literal}
 <script type="text/javascript">

   init_blocks = function( ) {
{/literal}
      var showBlocks = new Array({$showBlocks});
      var hideBlocks = new Array({$hideBlocks});
{literal}
      on_load_init_blocks( showBlocks, hideBlocks );
      // Added next 2 lines to reverse the show and hide states for commPrefs blocks
      hide('commPrefs');
      show('commPrefs_show');
  }

  dojo.addOnLoad( init_blocks );
 </script>
Protect your investment in CiviCRM by  becoming a Member!

emilyf

  • Ask me questions
  • ****
  • Posts: 696
  • Karma: 54
  • CiviCRM version: 2.x - 4.x
  • CMS version: Drupal 5, 6, 7
Re: Collapsible Fieldsets
October 07, 2008, 11:29:13 am
Thanks, Dave. I'm soooo glad I didn't keep staring and scratching my head! As promised, I've added this example to http://wiki.civicrm.org/confluence/display/CRMDOC/Customize+Built-in+and+Profile+Screens

emilyf

  • Ask me questions
  • ****
  • Posts: 696
  • Karma: 54
  • CiviCRM version: 2.x - 4.x
  • CMS version: Drupal 5, 6, 7
Re: Collapsible Fieldsets
October 29, 2009, 05:38:01 am
I'm back at it. Need to do this same task in 3.0.

Summary: When editing a contact in 3.0, I need the 'Custom Data' tab to be auto-expanded. I know there is a 'expand all fieldsets' link, but my organization only wants Contact Details and Custom Data expanded by default.

I've tracked the tpl form and think I'm supposed to make a change on CRM/Custom/Form/CustomData.tpl

Looking at my previous instructions on the wiki, I was trying to add the hide/show code. However, I can't find how I would address showing ALL the custom data as one big set...it looks like each set of fields now has its own hide/show prefs in the template? Basically, I'm just confused on how to do it in 3.0...suggestions?

xavier

  • Forum Godess / God
  • I’m (like) Lobo ;)
  • *****
  • Posts: 4453
  • Karma: 161
    • Tech To The People
  • CiviCRM version: yes probably
  • CMS version: drupal
Re: Collapsible Fieldsets
October 29, 2009, 07:37:10 am
Add your own jQuery code.

Not checked what is the id of the block you want to show, say #custom42
Code: [Select]
add at the top of your template:
<script type="text/javascript">
    jQuery( function ($) {
        $( '#custom42').show();
    });

</script>

play with firebug to find the right div id
-Hackathon and data journalism about the European parliament 24-26 jan. Watch out the result

emilyf

  • Ask me questions
  • ****
  • Posts: 696
  • Karma: 54
  • CiviCRM version: 2.x - 4.x
  • CMS version: Drupal 5, 6, 7
Re: Collapsible Fieldsets
October 29, 2009, 08:00:39 am
hey xavier

thanks...but that is giving me smarty errors when i apply that code to the top of CRM/Custom/Form/CustomData.tpl

No matter which div (the full group or an individual set of fields) I put in it gives these 2 errors.

    * user error: Smarty error: [in CRM/Custom/Form/CustomData.tpl line 2]: syntax error: unrecognized tag: $( '#customData').show(); (Smarty_Compiler.class.php, line 446) in /home/stoneran/public_html/sites/all/modules/civicrm/packages/Smarty/Smarty.class.php on line 1094.
    * user error: Smarty error: [in CRM/Custom/Form/CustomData.tpl line 2]: syntax error: unrecognized tag '' (Smarty_Compiler.class.php, line 590) in /home/stoneran/public_html/sites/all/modules/civicrm/packages/Smarty/Smarty.class.php on line 1094.


Donald Lobo

  • Administrator
  • I’m (like) Lobo ;)
  • *****
  • Posts: 15963
  • Karma: 470
    • CiviCRM site
  • CiviCRM version: 4.2+
  • CMS version: Drupal 7, Joomla 2.5+
  • MySQL version: 5.5.x
  • PHP version: 5.4.x
Re: Collapsible Fieldsets
October 29, 2009, 10:16:52 am

surrond that javascript with the smarty tags

{literal} ... YOUR JS CODE HERE ... {/literal}

lobo
A new CiviCRM Q&A resource needs YOUR help to get started. Visit our StackExchange proposed site, sign up and vote on 5 questions

emilyf

  • Ask me questions
  • ****
  • Posts: 696
  • Karma: 54
  • CiviCRM version: 2.x - 4.x
  • CMS version: Drupal 5, 6, 7
Re: Collapsible Fieldsets
October 29, 2009, 10:37:30 am
 ;D

thanks; that gives away how little i know about smarty....works great.

xavier

  • Forum Godess / God
  • I’m (like) Lobo ;)
  • *****
  • Posts: 4453
  • Karma: 161
    • Tech To The People
  • CiviCRM version: yes probably
  • CMS version: drupal
Re: Collapsible Fieldsets
October 29, 2009, 11:07:16 am
Yep, smarty chokes on the "{" used for the javascript. {literal} tells it to leave the js code and not try to mess it.
-Hackathon and data journalism about the European parliament 24-26 jan. Watch out the result

emilyf

  • Ask me questions
  • ****
  • Posts: 696
  • Karma: 54
  • CiviCRM version: 2.x - 4.x
  • CMS version: Drupal 5, 6, 7
Re: Collapsible Fieldsets
June 11, 2010, 03:27:18 am
This seems to break every time I upgrade...now I'm on 3.1. My div id is 'customData'. I updated my tpl file to use the 3.1 file, and I saw that if I put the code:
Code: [Select]
{literal}
<script type="text/javascript">
    jQuery( function ($) {
        $( '#customData').show();
    });

</script>
{/literal}

in CRM/Custom/Form/CustomData.tpl then the javascript was getting put after the div. So then I moved it to CRM/Contact/Form/Contact.tpl and I now see it loading at the top of that page, but it's still not expanding my custom data fieldset by default. Do I need updated jQuery code or something?

xavier

  • Forum Godess / God
  • I’m (like) Lobo ;)
  • *****
  • Posts: 4453
  • Karma: 161
    • Tech To The People
  • CiviCRM version: yes probably
  • CMS version: drupal
Re: Collapsible Fieldsets
June 11, 2010, 07:52:08 am
Think it's "phase of the moon suffix" related issue. Have a look at that post:
http://civicrm.org/blogs/xavier/how-customise-contact-reference-custom-field
-Hackathon and data journalism about the European parliament 24-26 jan. Watch out the result

Pages: [1]
  • CiviCRM Community Forums (archive) »
  • Old sections (read-only, deprecated) »
  • Developer Discussion (Moderator: Donald Lobo) »
  • Collapsible Fieldsets

This forum was archived on 2017-11-26.