CMS Development

Hani
Participant

adding loop.index to variable name

SOLVE

Hi,

 

what is the correct syntax for adding the number of the current iteration inside a loop to the name of a variable?

We have a custom module (for an email template) with a group of elements that can be added multiple times.

Every group (so every iteration) needs a variable with a different value.


for example:

 

set int_var1 = 200

next iteration:

set int_var2 = 400

 

I tried connecting the variable with loop.index using ~ but it only

shows the iteration.

 

any help is much appreciated

0 Upvotes
1 Accepted solution
jmclaren
Solution
HubSpot Employee
HubSpot Employee

adding loop.index to variable name

SOLVE

Hi Hani,

Not certain exactly what you're trying to do, but seems like you could just use a dict. then you can set the keys to whatever string you want. Essentially mimicking the functionality you're wanting, in a safer way.

https://designers.hubspot.com/docs/hubl/hubl-variables-and-macros-syntax
https://developers.hubspot.com/changelog/new-feature-new-list-operations

Jon McLaren

Sr. CMS Developer Advocate

Get started developing on the HubSpot CMS Developer Changelog
How to optimize your CMS Hub site for speed

If my reply answered your question, please mark it as a solution, to make it easier for others to find.

View solution in original post

6 Replies 6
Kevin-C
Recognized Expert | Partner
Recognized Expert | Partner

adding loop.index to variable name

SOLVE

Hey @Hani 

I'm not sure I understand your usecase as described but have you looked into "Variable Within loops"? Your description sounds like this could be used to add key value pairs to an object rather than declaring new valiables for each loop.

Kevin Cornett - Sr. Solutions Architect @ BridgeRev
0 Upvotes
Hani
Participant

adding loop.index to variable name

SOLVE

Hey @Kevin-C 

 

thanks for your response.

Regarding the usecase:

We would like our content managers do have the option of choosing between

3 layouts within a custom element. (using a choice field)

Depending on which layout they choose, the width of the td-columns (or divs) is set.


We wouldn't need dynamic variables in this case if we could

override the value of an existing field within the group. 

(item.field_width for example )

Would that be possible with the "Variable within loops" method?

0 Upvotes
Kevin-C
Recognized Expert | Partner
Recognized Expert | Partner

adding loop.index to variable name

SOLVE

Hey @Hani 

 

Thanks for the clairification.

 

In this case I would make a custom module with the option to select 1 of the 3 layouts.

Us this selection to define a variable's value and use an if statement to define the html structure.

 

{# custom module selection defines the layout variable #}
{# query the variable to determine which layout to use #}
{% if widget_data.my_module == 1 %} {# define variables #} {% set width_one = "300px" %} {% set width_two = "100px" %} {% set width_three = "200px" % {# insert code for layout option 1 #} {% elseif widget_data.my_module == 2 %} {# define variables #} {% set width_one = "200px" %} {% set width_two = "100px" %} {% set width_three = "300px" % {# insert code for layout option 2 #} {% elseif widget_data.my_module == 3 %} {# define variables #} {% set width_one = "100px" %} {% set width_two = "300px" %} {% set width_three = "200px" % {# insert code for layout option 3 #} {% endif %}

There are plenty of other wasy to define this logic but this might be the easiest to understand if you haven't worked with it a lot.

 

Let me know if you need more clarification and hope it helps!

Kevin Cornett - Sr. Solutions Architect @ BridgeRev
0 Upvotes
Hani
Participant

adding loop.index to variable name

SOLVE

@Kevin-C  thank you for the snippet!

This was my approach too.

However if you repeat the content element multiple times (I probably didn't make this point clear before)

it will always use the value of the last one for all

using your example:

If the first layout uses option 1, the second 2 and the third 3

width_one would be 100px for all of them.

That's why I needed unique variable names.

 

However I think I will simply limit the number you can repeat that element to 3

and add the complete layout (with the particular width) in each iteration of the loop... not a very elegant solution but it will work for now and probably most of our emails.

(of course I could do 3 separate elements without repeating one but I think that would be even worse) 

I just don't understand why I can't simply do something like 

{% set width_one~loop.index = "100px" %}

 

0 Upvotes
jmclaren
Solution
HubSpot Employee
HubSpot Employee

adding loop.index to variable name

SOLVE

Hi Hani,

Not certain exactly what you're trying to do, but seems like you could just use a dict. then you can set the keys to whatever string you want. Essentially mimicking the functionality you're wanting, in a safer way.

https://designers.hubspot.com/docs/hubl/hubl-variables-and-macros-syntax
https://developers.hubspot.com/changelog/new-feature-new-list-operations

Jon McLaren

Sr. CMS Developer Advocate

Get started developing on the HubSpot CMS Developer Changelog
How to optimize your CMS Hub site for speed

If my reply answered your question, please mark it as a solution, to make it easier for others to find.

Hani
Participant

adding loop.index to variable name

SOLVE

@jmclaren 

thanks for the links. I thought I had already checked out the dict option
but I have overlooked the New List Operations.
I solved it by using dict_var.update

     {% if item.col_layout == 3 %} 
        
            {% set test = dict_var.update({'img_width_var': '300'}) %}
            {% set test = dict_var.update({'txt_width_var': '300'}) %}
    
        {% endif %}
        
        {% if item.col_layout == 2 %} 
        
            {% set test = dict_var.update({'img_width_var': '200'}) %}
            {% set test = dict_var.update({'txt_width_var': '400'}) %}

        {% endif %}
        
        
        {% if item.col_layout == 1 %} 
        
            {% set test = dict_var.update({'img_width_var': '100'}) %}
            {% set test = dict_var.update({'txt_width_var': '500'}) %}

        {% endif %}

Also I posted a screenshot of the module.
I hope that explains what I was trying to do 🙂

 

custom_layout_element_email.jpg

Because the 3 rows are all inside one group I was afraid it would override the width variables of the first and second row with the values of the last element again but it in this case it didn't. It works!

 

Thanks for the help everyone  Robot Very Happy