0

Perplexed how or if this can be achieved.

I have a grid field e_contact that consists of three field/columns:

Name   Phone   Email

{ename}   {ephone}   {eemail}

My code to display this is:

<span><i class="fa fa-fw fa-phone"></i>
  {e_contact}
    <a href="tel:{e_contact:ephone}">{e_contact:ephone}</a> ({e_contact:ename}) 
  {/e_contact}
</span>

<span><i class="fa fa-fw fa-envelope"></i>
  {e_contact}
    <a href="mailto:{e_contact:eemail}">{e_contact:eemail}</a> 
  {/e_contact}
</span>

Which would display:

[icon] Phone (Name)
[icon] Email

If multiple (let's say 3) rows of info is added, I want it to appear like so:

[icon] Phone1 (Name1)   or   Phone2 (Name2)   or   Phone3 (Name3)
[icon] Email1   or   Email2   or   Email3


So, a couple of things...
If no Email is added, then that (2nd) span should not appear on the page at all.
(A Name and Phone will always get added.)


Also, how do i get the field entries to display next to one another as above, with the word 'or' between each instance.

Similarly, the brackets around the name should obviously only appear if a name is entered in the field. (Multiple 'Phone' numbers may get added (in new rows) but only one 'Name' (in the first row).)


Any help is much appreciated!

| improve this question | | | | |
  • If an answer is correct or helpful please mark. Thanks- – Romans-8---31-39 Apr 13 '17 at 20:57
1

That's do-able, something like this should get you going, by using count conditionally you'll only ever get output if something exists:

{e_contact}
  {if e_contact:count=="1"}
    <span><i class="fa fa-fw fa-phone"></i>
      <a href="tel:{e_contact:ephone}">{e_contact:ephone}</a> 
      ({e_contact:ename})</span>
  {/if}
  {if e_contact:count =="2" AND "{e_contact:ephone}" != ""}
    or <a href="tel:{e_contact:ephone}">{e_contact:ephone}</a> ({e_contact:ename})
  {/if}
  {if e_contact:count=="3" AND "{e_contact:ephone}" != ""}
     or <a href="tel:{e_contact:ephone}">{e_contact:ephone}</a>({e_contact:ename})
  {/if}
{/e_contact}      
<!-- This above will spit out on one line 
icon / phone1 name1 or phone2 name2 or phone3 name3
-->

{e_contact}
  {if e_contact:count=="1" AND "{e_contact:eemai}" != ""}
    <span><i class="fa fa-fw fa-envelope"></i>
      <a href="mailto:{e_contact:eemail}">{e_contact:eemail}</a> 
    </span>
  {/if}
  {if e_contact:count =="2" AND "{e_contact:eemai}" != ""}
    or <a href="mailto:{e_contact:eemail}">{e_contact:eemail}</a> 
  {/if}
  {if e_contact:count =="3" AND "{e_contact:eemai}" != ""}
     or<a href="mailto:{e_contact:eemail}">{e_contact:eemail}</a> 
  {/if}
{/e_contact}
<!-- This above will spit out on one line 
icon / email1 or email2 or email 3
-->

I'd probably use stash to capture all the variables and manage the output from there but if your new, this, while a tad verbose it should work the way you want.

UPDATE

Given your replies, I've added extra conditionals that checks to make sure the field isn't empty too. If you haven't read the 'conditionals' docs, here's a link

| improve this answer | | | | |
  • Thanks very much for that. How would the code change though so that "If no Email is added, then that (2nd) span should not appear on the page at all?" – ZEDG Apr 12 '17 at 14:11
  • Because even though that grid field/column is emply, it is still producing <span><i class="fa fa-fw fa-envelope"></i><a href="mailto:"></a></span> – ZEDG Apr 12 '17 at 14:23
  • Since there is three columns in the grid field, if only one of the fields is filled then it is still producing code. 'Count' references the row, and not the individual columns in the row. – ZEDG Apr 12 '17 at 15:27
  • Just updated my answer – stuartmcd69 Apr 13 '17 at 0:02
  • Thankyou works great. To close the span 'after' any/all conditionals I removed it from where you had it and added: {e_contact limit="1"}{if e_contact:ephone}</span>{/if}{/e_contact} – ZEDG Apr 14 '17 at 8:24

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.