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 /

Passing the content of a text field to an array


Reply


5 Posts   734 Views

Avatar
Deee83

Community Member, 3 Posts

31 August 2011 at 7:05am

Hi guys,

I want to use a jQuery plugin („Slides“) in my SS theme for a rotating banner.

For this purpose, I have added a text field named “HeaderImages” to the CMS. In this field I would like to write the urls of the images that should be used in the banner of the current site (e.g. ‘image1.jpg’, ‘image2.jpg’, ‘image3.jpg’). The content of this field should be passed to the array of the Slides plugin.

Unfortunately, I couldn’t find out yet how to do that?! I hope someone can help me...

Here’s the code:
Page.php:

class Page extends SiteTree {

   public static $db = array(
'HeaderImages' => 'Text'
   );

   ...

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

$fields->addFieldToTab('Root.Content.Main', new TextField('HeaderImages'), 'Content');

return $fields;
}

}

class Page_Controller extends ContentController {

   ...

public function init() {
Requirements::customScript("
jQuery(document).ready(function(){
jQuery('#slideimage').Slides({ images: [image1.jpg, image2.jpg, image3.jpg] });      
});
");

parent::init();

}
}

Page.ss:

...
   <body>
   ...   
<div id="Header">
<img src="image1.jpg" id="slideimage">
</div>
...

<script type="text/javascript" src="mysite/javascript/jquery-1.6.2.min.js"></script>
<script type="text/javascript" src="mysite/javascript/jquery.slides.min.js"></script>
</body>
</html>

Avatar
martimiz

Forum Moderator, 1105 Posts

31 August 2011 at 8:14am

You can use php variables within the customScript() function to inject the image filenames...

Avatar
Deee83

Community Member, 3 Posts

31 August 2011 at 6:27pm

Thanks for the fast answer!

How can I refer to the $HeaderImages variable? I've already tried to use variables in the function, but I'm quite a beginner in PHP, and unfortunately I seem to have done it the wrong way... :-(

public function init() {
Requirements::customScript("
$SlideImages = $HeaderImages;
jQuery(document).ready(function(){
jQuery('#slideimage').Slides({ images: $SlideImages });      
});"
);

Avatar
martimiz

Forum Moderator, 1105 Posts

31 August 2011 at 11:46pm

Suppose you have a HeaderImages textfield in your CMS, where you add the following: image1.jpg, image2.jpg, image3.jpg'

This is already a format you can use for your javascript array. Next in your init() function you refer to the field as $this->HeaderImages. Now you only need to replace the hardcoded images:

function init() {
   parent::init();
   
   Requirements::customScript("
      jQuery(document).ready(function(){
         jQuery('#slideimage').Slides({ images: [" . $this->HeaderImages . "] });
      });
   ");

}

This should at least get you the scripblock like you described it. If the JavaScript works, I wouldn't know :-)

Avatar
Deee83

Community Member, 3 Posts

1 September 2011 at 6:56am

Works perfectly now!

Thanks a lot!!!!