Jump to:

22987 Posts in 11841 Topics by 2826 members

General Questions

SilverStripe Forums » General Questions » Creating an editable jQuery Tabbed Panel

General questions about getting started with SilverStripe that don't fit in any of the categories above.

Moderators: martimiz, Sean, biapar, Willr, Ingo, swaiba, simon_w

Page: 1
Go to End
Author Topic: 2303 Views
  • Blackthorn87
    Avatar
    Community Member
    27 Posts

    Creating an editable jQuery Tabbed Panel Link to this post

    Hey Guys,

    I've been looking on the net and trying to figure out how to build a jQuery Tabbed Panel all day today with no success (like this one: http://jqueryui.com/demos/tabs/). What I need it to be able to create, is a tabbed panel as a widget type object that can easily be configured and then used on everypage in the website (the same one configuration).

    What is wanted to know is either:

    1. Does anybody have a module/widget that will do this?

    OR

    2. How can I create it myself.

    I'm very competent with html and css and have someone that can help with the javascript, what I'm really struggling with is getting SilverStripe to do this so that my client can edit the contents of the panes and also add or remove panes as they wish.

    Any help in converting jquery (things) into SilverStripe what be helpful, or any pointers to any tutorials would be helpful. But more helpful would be answers to the points above.

    If you guys need more information let me know.

    Thanks to anyone that can help,

    Arun.

  • Willr
    Avatar
    Forum Moderator
    5464 Posts

    Re: Creating an editable jQuery Tabbed Panel Link to this post

    What are you struggling with? You can write Javascript just as you would in plain jane HTML as you would in SilverStripe.

    See http://doc.silverstripe.org/sapphire/en/topics/javascript for information on how to include the files but if you want it on every page you should edit the main Page.ss template

    <% require(link/to/yourjs.js) %>

    I suggest you don't make it a widget, and make it an'Include' template.

  • prawnstar
    Avatar
    Community Member
    116 Posts

    Re: Creating an editable jQuery Tabbed Panel Link to this post

    Hi, Arun,

    Creating a tabbed box with jQuery/SilverStripe is really pretty easy. And I agree with Will to not make it a widget.

    What I usually do is create a parent page with a few child pages. In my parent page template I iterate over the child pages with a control loop to produce the tabbed box. Typically the title of the child page is the text I use for the tabs and the content of the child pages are the content for each box. The jQuery tabbed box goes in the parent page template. As the control loop loops over each child page it builds the tabbed box.

    Make sense?

    Chris

  • Blackthorn87
    Avatar
    Community Member
    27 Posts

    Re: Creating an editable jQuery Tabbed Panel Link to this post

    Thank you guys.

    I know it's been a while, but I managed to get this working by using an include template, but the idea about looping through child pages, seems like the best way to do it.

    Thanks again.

  • goodness
    Avatar
    Community Member
    38 Posts

    Re: Creating an editable jQuery Tabbed Panel Link to this post

    I really like the idea of making tab'd contact that is user-editable within the CMS. I'd like to implement this in several FAQ sections.
    Could someone please supply some detail (code and directions) on how to create and implement this?

    Thanks in advance to the kind person(s) willing to help!

  • goodness
    Avatar
    Community Member
    38 Posts

    Re: Creating an editable jQuery Tabbed Panel Link to this post

    Isn't there anyone that could offer up directions and code to make this happen?

    I know this was covered in the past (looks like 2011) but I'm new to SS and hoping someone can show me how to get this working.

    Thanks again.

  • goodness
    Avatar
    Community Member
    38 Posts

    Re: Creating an editable jQuery Tabbed Panel Link to this post

    I'm surprised that it has been 10 days since my original request for help with this. For the most part I have been really impressed with the willingness of the members of this forum to help out.

    Anyone?

    2303 Views
Page: 1
Go to Top

Want to know more about the company that brought you SilverStripe? Then check out SilverStripe.com

Comments on this website? Please give feedback.