Creating nested MIGX

1

Hi All,

I nedd to create a nested Migx so that a user can click add new, and then have the title ( text ), content ( richtext ) and then add mulitple images.

This is so they can add multiple sections to the pages which all have image scrollers but I can’t work out how to get the add new on the images, can anyone point me in the right direction please.

Thanks

1 Like
2

Create a second MIGX config for the images.

Then in the config (with the “title” and “content” fields) add a new field with “Input TV type” = migx and “Configs” = “name of the second MIGX config”.

3

Almost there, but when clicking add new on the images I just get a text input and not an image select.

TV hairsparsection
Form Tabs

[{
  "caption": "Info",
  "fields": [{
      "field": "title",
      "caption": "Title"
    },
    {
      "field": "description",
      "caption": "Description",
      "inputTVtype": "text"
    }
  ]
},
{
  "caption": "Image",
  "fields": [{
    "field": "image",
    "caption": "Image 520px by 700px",
    "inputTVtype": "migx",
    "config": "additionalImages"
  }]
}
]

Grid colums

[
  {
    "header": "Title",
    "width": "160",
    "sortable": "true",
    "dataIndex": "title"
  }, {
    "header": "Image",
    "width": "50",
    "sortable": "false",
    "dataIndex": "image",
    "renderer": "this.renderImage"
  }]

TV additionalImages

Form Tabs

[
{
  "caption": "Image",
  "fields": [{
    "field": "image",
    "caption": "Image 520px by 700px",
    "inputTVtype": "image",
  }]
}
]

Grid Colums

[
  {
    "header": "Image",
    "width": "50",
    "sortable": "false",
    "dataIndex": "image",
    "renderer": "this.renderImage"
  }]

What have I done wrong ?

4

inputTVtype is only correct, if you use a MIGX config (created in the CMP under “Extras” → “MIGX”) for the nested MIGX.

If you use a TV as the nested MIGX, use inputTV = “TV name” instead (and configs is no longer necessary).

5

Thanks for your time Harry,

Ive updated the hairspasection form tabs to:

[{
  "caption": "Info",
  "fields": [{
      "field": "title",
      "caption": "Title"
    },
    {
      "field": "description",
      "caption": "Description",
      "inputTVtype": "text"
    }
  ]
},
{
  "caption": "Image",
  "fields": [{
    "field": "image",
    "caption": "Image 520px by 700px",
    "inputTV": "additionalImages"
  }]
}
]

But now I get the error “There seems to be an error in the formtabs-config” when I click the add new on the image tab.

Sorry, I’m crap at MIGX it drives me mad :crazy_face:

6

Sorted, I had a stray , in additionalImages Form Tabs

7

OK Last question for this, I can’t get the images to display, main template contains:

[[getImageList?
                &tvname=`hairsparsection`
                &tpl=`hairsparsection`]]

hairsparsection chunk contains:

<ul class="hair-spa">
                [[getImageList?
                &tvname=`additionalimages`
                &tpl=`additionalimages`]]
                
            </ul>
            <div class="hair-spa-text">
            <h3>[[+title]]</h3>
                [[+description]]
            </div>

additionalimages chunk contains:

<li class="hair-spa-item">
                    <img src="[[+image]]" alt="Hair-spa" />
                </li>

but nothing is output for the images, what have I done wrong ?

8

Use the property &value instead of &tvname.

[[getImageList? &value=`[[+image]]` &tpl=`additionalimages`]]

(The data is not actually stored in the TV “additionalimages”. It’s stored as the field “image” in the TV “hairsparsection”.)

9

Thanks Harry, your a legend :+1:

1 Like