MultiColumn tutorial outputs array....

572 Posts

9thwave Reply #1, 11 years, 7 months ago

Hi,

I've been follwoing the MultiColumn tutorial and everything works great apart from the front-end also outputs an array:

Array
(
    [MIGX_id] => 1
    [image] => assets/Media/images/Logos/facebook-logo-blue.jpeg
    [title] => title field here
    [description] => 
a description


    [_alt] => 0
    [_first] => 1
    [_last] => 
    [idx] => 1
    [property.tpl] => @FIELD:MIGX_formname
    [property.tvname] => MultiColumn
)

could anyone tell me what i'm doing wrong?

Thanks

J

www.9thwave.co.uk
WEB | DESIGN | PRINT

5,888 Posts

Bruno17 Reply #2, 11 years, 7 months ago

what's your getImageList - call?

-------------------------------

you can buy me a beer, if you like MIGX

http://webcmsolutions.de/migx.html

Thanks!

572 Posts

9thwave Reply #3, 11 years, 7 months ago

Thanks for replying
the call is exactly the same as the tutorial http://rtfm.modx.com/display/ADDON/MIGX.Varying+layout-boxes:
[[!getImageList? &tpl=`@FIELD:MIGX_formname` &tvname=`MultiColumn`]]

if i change the &tpl to 'TwoCells' (which is the one i'm using) the Array disappears but in the html source code an extra set of boxes appear above the two i'v added consequently creating a lot of empty space.

www.9thwave.co.uk
WEB | DESIGN | PRINT

5,888 Posts

Bruno17 Reply #4, 11 years, 6 months ago

seems your record hasn't a field with name MIGX_formname
getImageList tries to use a chunk with the name of the value in MIGX_formname and can't find this field.

-------------------------------

you can buy me a beer, if you like MIGX

http://webcmsolutions.de/migx.html

Thanks!

572 Posts

9thwave Reply #5, 11 years, 6 months ago

Ok i think i'm a bit stuck in that case.
Would you mind looking at the following and letting me know what's wrong with it so i can better understand please...
The code i have is the same as the tutorial. I have my chunks for each of the formname fields i.e, "OneCell", "TwoCells", "ThreeCells".

[{
    "formname":"OneCell"
    ,"formtabs": [{
        "caption":"Row Format"
        ,"fields": [{
            "field":"fake"
            ,"inputTV":"hiddenTV"
        },{
            "field":"cell_2_image"
            ,"caption":"Image"
            ,"inputTV":"hiddenTV"
        },{
            "field":"cell_2_headline"
            ,"caption":"Headline"
            ,"inputTV":"hiddenTV"
        },{
            "field":"cell_2_content"
            ,"caption":"Content"
            ,"inputTV":"hiddenTV"
        },{
            "field":"cell_3_image"
            ,"caption":"Image"
            ,"inputTV":"hiddenTV"
        },{
            "field":"cell_3_headline"
            ,"caption":"Headline"
            ,"inputTV":"hiddenTV"
        },{
            "field":"cell_3_content"
            ,"caption":"Content"
            ,"inputTV":"hiddenTV"
        }]
    },{
        "caption":"First"
        ,"fields": [{
            "field":"cell_1_image"
            ,"caption":"Image"
            ,"inputTV":"imageTV"
        },{
            "field":"cell_1_headline"
            ,"caption":"Headline"
        },{
            "field":"cell_1_content"
            ,"caption":"Content"
            ,"inputTV":"richtextTV"
        }]
    }]
},{
    "formname":"TwoCells"
    ,"formtabs":[{
        "caption":"Row Format"
        ,"fields": [{
            "field":"fake"
            ,"inputTV":"hidden"
        },{            "field":"cell_3_image"
            ,"caption":"Image"
            ,"inputTV":"hiddenTV"
        },{
            "field":"cell_3_headline"
            ,"caption":"Headline"
            ,"inputTV":"hiddenTV"
        },{
            "field":"cell_3_content"
            ,"caption":"Content"
            ,"inputTV":"hiddenTV"
        }]
    },{
        "caption":"First"
        ,"fields":[{
            "field":"cell_1_image"
            ,"caption":"Image"
            ,"inputTV":"imageTV"
        },{
            "field":"cell_1_headline"
            ,"caption":"Headline"
        },{
            "field":"cell_1_content"
            ,"caption":"Content"
            ,"inputTV":"richtextTV"
        }]
    },{
        "caption":"Second"
        ,"fields":[{
            "field":"cell_2_image"
            ,"caption":"Image"
            ,"inputTV":"imageTV"
        },{
            "field":"cell_2_headline"
            ,"caption":"Headline"
        },{
            "field":"cell_2_content"
            ,"caption":"Content"
            ,"inputTV":"richtextTV"
        }]
    }]
},{
    "formname":"ThreeCells"
    ,"formtabs":[{
        "caption":"Row Format"
        ,"fields": [{
            "field":"fake"
            ,"inputTV":"hiddenTV"
        }]
    },{
        "caption":"First"
        ,"fields": [{
            "field":"cell_1_image"
            ,"caption":"Image"
            ,"inputTV":"imageTV"
        },{
            "field":"cell_1_headline"
            ,"caption":"Headline"
        },{
            "field":"cell_1_content"
            ,"caption":"Content"
            ,"inputTV":"richtextTV"
        }]
    },{
        "caption":"Second"
        ,"fields":[{
            "field":"cell_2_image"
            ,"caption":"Image"
            ,"inputTV":"imageTV"
        },{
            "field":"cell_2_headline"
            ,"caption":"Headline"
        },{
            "field":"cell_2_content"
            ,"caption":"Content"
            ,"inputTV":"richtextTV"
        }]
    },{
        "caption":"Third"
        ,"fields":[{
            "field":"cell_3_image"
            ,"caption":"Image"
            ,"inputTV":"imageTV"
        },{
            "field":"cell_3_headline"
            ,"caption":"Headline"
        },{
            "field":"cell_3_content"
            ,"caption":"Content"
            ,"inputTV":"richtextTV"
        }]
    }]
}]

[{
    "header": "Row Format"
    ,"width": "30"
    ,"sortable": "true"
    ,"dataIndex": "MIGX_formname"
},{
    "header": "First"
    ,"width": "160"
    ,"sortable": "false"
    ,"dataIndex": "cell_1_image"
    ,"renderer": "this.renderImage"
},{
    "header": "Second"
    ,"width": "160"
    ,"sortable": "false"
    ,"dataIndex": "cell_2_image"
    ,"renderer": "this.renderImage"
},{
    "header": "Third"
    ,"width": "160"
    ,"sortable": "false"
    ,"dataIndex": "cell_3_image"
    ,"renderer": "this.renderImage"
}]

I've attached 2 screenshots of how things look in the resource. When TwoCells is selected i get an input field and am not sure if this is supposed to be there?

Thanks for your help

www.9thwave.co.uk
WEB | DESIGN | PRINT

5,888 Posts

Bruno17 Reply #6, 11 years, 6 months ago

Not sure, if this can be the issue. There is:

{
    "formname":"TwoCells"
    ,"formtabs":[{
        "caption":"Row Format"
        ,"fields": [{
            "field":"fake"
            ,"inputTV":"hidden"

should be:

{
    "formname":"TwoCells"
    ,"formtabs":[{
        "caption":"Row Format"
        ,"fields": [{
            "field":"fake"
            ,"inputTV":"hiddenTV"

Tested it with this formtabs just now and this was working:

[{
    "formname":"OneCell"
    ,"formtabs": [{
        "caption":"Row Format"
        ,"fields": [{
            "field":"fake"
            ,"inputTVtype":"hidden"
        },{
            "field":"cell_2_image"
            ,"caption":"Image"
            ,"inputTVtype":"hidden"
        },{
            "field":"cell_2_headline"
            ,"caption":"Headline"
            ,"inputTVtype":"hidden"
        },{
            "field":"cell_2_content"
            ,"caption":"Content"
            ,"inputTVtype":"hidden"
        },{
            "field":"cell_3_image"
            ,"caption":"Image"
            ,"inputTVtype":"hidden"
        },{
            "field":"cell_3_headline"
            ,"caption":"Headline"
            ,"inputTVtype":"hidden"
        },{
            "field":"cell_3_content"
            ,"caption":"Content"
            ,"inputTVtype":"hidden"
        }]
    },{
        "caption":"First"
        ,"fields": [{
            "field":"cell_1_image"
            ,"caption":"Image"
            ,"inputTVtype":"image"
        },{
            "field":"cell_1_headline"
            ,"caption":"Headline"
        },{
            "field":"cell_1_content"
            ,"caption":"Content"
            ,"inputTVtype":"richtext"
        }]
    }]
},{
    "formname":"TwoCells"
    ,"formtabs":[{
        "caption":"Row Format"
        ,"fields": [{
            "field":"fake"
            ,"inputTVtype":"hidden"
        },{"field":"cell_3_image"
            ,"caption":"Image"
            ,"inputTVtype":"hidden"
        },{
            "field":"cell_3_headline"
            ,"caption":"Headline"
            ,"inputTVtype":"hidden"
        },{
            "field":"cell_3_content"
            ,"caption":"Content"
            ,"inputTVtype":"hidden"
        }]
    },{
        "caption":"First"
        ,"fields":[{
            "field":"cell_1_image"
            ,"caption":"Image"
            ,"inputTVtype":"image"
        },{
            "field":"cell_1_headline"
            ,"caption":"Headline"
        },{
            "field":"cell_1_content"
            ,"caption":"Content"
            ,"inputTVtype":"richtext"
        }]
    },{
        "caption":"Second"
        ,"fields":[{
            "field":"cell_2_image"
            ,"caption":"Image"
            ,"inputTVtype":"image"
        },{
            "field":"cell_2_headline"
            ,"caption":"Headline"
        },{
            "field":"cell_2_content"
            ,"caption":"Content"
            ,"inputTVtype":"richtext"
        }]
    }]
},{
    "formname":"ThreeCells"
    ,"formtabs":[{
        "caption":"Row Format"
        ,"fields": [{
            "field":"fake"
            ,"inputTVtype":"hidden"
        }]
    },{
        "caption":"First"
        ,"fields": [{
            "field":"cell_1_image"
            ,"caption":"Image"
            ,"inputTVtype":"image"
        },{
            "field":"cell_1_headline"
            ,"caption":"Headline"
        },{
            "field":"cell_1_content"
            ,"caption":"Content"
            ,"inputTVtype":"richtext"
        }]
    },{
        "caption":"Second"
        ,"fields":[{
            "field":"cell_2_image"
            ,"caption":"Image"
            ,"inputTVtype":"image"
        },{
            "field":"cell_2_headline"
            ,"caption":"Headline"
        },{
            "field":"cell_2_content"
            ,"caption":"Content"
            ,"inputTVtype":"richtext"
        }]
    },{
        "caption":"Third"
        ,"fields":[{
            "field":"cell_3_image"
            ,"caption":"Image"
            ,"inputTVtype":"image"
        },{
            "field":"cell_3_headline"
            ,"caption":"Headline"
        },{
            "field":"cell_3_content"
            ,"caption":"Content"
            ,"inputTVtype":"richtext"
        }]
    }]
}]

-------------------------------

you can buy me a beer, if you like MIGX

http://webcmsolutions.de/migx.html

Thanks!

572 Posts

9thwave Reply #7, 11 years, 6 months ago

Hi,

No that's not working for me.
I delete my resource content, empty the cache and still get the same Array on the page plus i don't have any options when i go to 'add item'.
I'll go through the steps again and see if i've missed something.

www.9thwave.co.uk
WEB | DESIGN | PRINT

572 Posts

9thwave Reply #8, 11 years, 6 months ago

ok i've broken this down and it's working but what i don't get is how to create two columns in formtabs, the rest sort of makes sense to me.
My chunk for one of the columns is:

<div class="eight columns">
<img src="[[+image:phpthumbof=`w=100&h=100&zc=1`]]" />
<h2>[[+title]]</h2>
<p>[[+description]]</p>
</div>

...but i need two columns with a clearing div so i need this html to be placed twice in the chunk.
Presumably i can create the chunk with duplicate html (and the form tabs below) with the fields named to [[+title-1]], [[description_1]] etc but how do i then use "formtabs"?
My formTabs is quite simple:

[
{"caption":"Info","fields":[
  {"field":"title","caption":"Title"},
  {"field":"description","caption":"description","inputTV":"richtextTV"}
]},

{"caption":"Image","fields":[
   {"field":"image","caption":"Image","inputTV":"imageTV"}
]}
]

sorry if this a simple request, just trying to understand.

Thanks

www.9thwave.co.uk
WEB | DESIGN | PRINT

5,888 Posts

Bruno17 Reply #9, 11 years, 6 months ago

if all what you need is a clearing div on each second item then you can try to place this into your chunks:

[[+alt:is=`1`:then=`<div class="clear"></div>`:else=``]]

-------------------------------

you can buy me a beer, if you like MIGX

http://webcmsolutions.de/migx.html

Thanks!

572 Posts

9thwave Reply #10, 11 years, 6 months ago

well for the sake of consistency on the site the ideal scenario would be to have the html columns wrapped in a 'row class' like this:

<div class="row">
<div class="eight columns">
<img src="[[+image:phpthumbof=`w=100&h=100&zc=1`]]" />
<h2>[[+title]]</h2>
<p>[[+description]]</p>
</div>
<div class="eight columns">
<img src="[[+image:phpthumbof=`w=100&h=100&zc=1`]]" />
<h2>[[+title]]</h2>
<p>[[+description]]</p>
</div>
</div><!-- row -->

i've never used filters before and can't find reference to the [[+alt]] placeholder in the book or rtfm but assume it's referring to whether there's an alternating column and if so place the <div> otherwise do nothing.
if i were to use this where exactly would it be placed?

www.9thwave.co.uk
WEB | DESIGN | PRINT