Skip to main content

This site requires you to update your browser. Your browsing experience maybe affected by not having the most up to date version.

Data Model Questions /

Image and Link field grouped together


Reply


7 Posts   3354 Views

Avatar
Aaron Brockhurst

Community Member, 30 Posts

12 March 2009 at 7:31am

Hi

I want the users to be able to upload / select an image and then select a page in silverstripe in the same block on the same tab. eg:

image
imagelink

Is this possible?

Also, is it possible for this to be a repeating block so that they can select more than one image and link combination?

Thanks in advance

Aaron

Avatar
Carbon Crayon

Community Member, 598 Posts

12 March 2009 at 11:58pm

Hi Aaron, this is very simple :)

Add these to your page model:

static $has_one = array(
'Image' => 'Image',
'LinkedPage' => 'SiteTree'
)

function getCMSFields(){
$fields = parent::getCMSFields();

$fields->addFiledToTab('Root.Content.Main' new ImageField('Image1'));
$fields->addFiledToTab('Root.Content.Main' new TreeDropdownField('LinkedPage', 'Page to link to', 'SiteTree'));

return $fields;

}

Then in your template you can simply do:

<a href="$LinkedPage.Link"><img src="$Image.URL" /></a>

Hope that helps!

Avatar
Aaron Brockhurst

Community Member, 30 Posts

13 March 2009 at 11:52pm

Hi Aram

Thanks for this, it's a great help.

What I was hoping to be able to do was put them in there own box in the UI so the user can see that they are related, if that makes sense?

Aaron

Avatar
Carbon Crayon

Community Member, 598 Posts

14 March 2009 at 2:20am

ahh sorry I think I was a little too quick to reply there!

I think what you want is a fieldGroup which you can use like this:

$fields->addFieldToTab("Root.Content.Main", new FieldGroup(
                                       new TreeDropdownField("LinkPage", "Page to link to", "SiteTree"),
                                       new ImageField("Image")
                                    ));

The default styling is not particularly pretty but it does the job.....you can always add/edit the CSS in cms/css

Avatar
Aaron Brockhurst

Community Member, 30 Posts

14 March 2009 at 3:12am

No worries, thanks for this.

I've got two of these on the page. When I put the following in I get an error on save:

$fields->addFieldToTab("Root.Content.Images", new FieldGroup(
new TreeDropdownField("ContentTopImageLinkID", "<b>Top Image Block</b><br />Select the page to link to and then choose the image to display", "SiteTree"),
                            new ImageField('ContentTopImage','')
));
      
      $fields->addFieldToTab("Root.Content.Images", new FieldGroup(
new TreeDropdownField("ContentBottomImageLinkID", "<strong>Top Image Block</strong><br />Select the page to link to and then choose the image to display", "SiteTree"),
                            new ImageField('ContentBottomImage','')
));

When I remove one of them it doesn't save the page id in the sitetree

Avatar
Carbon Crayon

Community Member, 598 Posts

14 March 2009 at 3:38am

hmm, just tried your code and it works fine for me. here is what I have:

public static $has_one = array(
       'ContentBottomImage' => 'Image',
      'ContentTopImage' => 'Image',
      'ContentTopImageLink' => 'SiteTree',
      'ContentBottomImageLink' => 'SiteTree'
   );
   
   
   public function getCMSFields()
   {
   $fields = parent::getCMSFields();   
   
   $fields->addFieldToTab("Root.Content.Images", new FieldGroup(
   new TreeDropdownField("ContentTopImageLinkID", "<b>Top Image Block</b><br />Select the page to link to and then choose the image to display", "SiteTree"),
    new ImageField('ContentTopImage','')
   ));
   
   
   $fields->addFieldToTab("Root.Content.Images", new FieldGroup(
   new TreeDropdownField("ContentBottomImageLinkID", "<strong>Top Image Block</strong><br />Select the page to link to and then choose the image to display", "SiteTree"),
    new ImageField('ContentBottomImage','')
   ));
      return $fields;
   }   

Avatar
Aaron Brockhurst

Community Member, 30 Posts

14 March 2009 at 3:47am

How very odd, plugged the code back in and it works fine. hmmmmmm!

Thanks