Editing content in a jquery Accordion menu

Hi guys,

I have an accordion menu running on my website, it works by having two divs, one the "accordionbtn" div which is the area the user presses to reveal more information and another "accordioncnt" div that contains the information to be revealed.

This functions correctly when in the user is viewing the website, but going into edit page mode the hidden div "accordioncnt" is not visible or selectable so they content inside it can not be updated. Even if i enter the edit mode when i have revealed the content on the page i get the same results, the "accordioncnt" is not visible or selectable".

Does anyone have any bright ideas as to how to get this working? I'll also be using the localscroll jquery and imagine this issue is going to extend to that too?


View Replies: View Best Answer
okhayat replied on at Permalink Reply
I have something similar using jQuery Tabs. What I did is stop the inclusion of CSS/JS at the time of edit.
This is done using:
if ($c->isEditMode()) {
 // put the accordion js/css code here to be
 // excluded from loading at Edit time
richardacherki replied on at Permalink Reply
HI okhayat,

Thanks for the response, i'm fairly new to php, with regards to the code to exclude do i just tell it to exclude the jquery script as i believe the jquery is the stuff controlling the hiding of the divs?

How exactly do i do this? Would it be:

if ($c->isEditMode()) {

I'd really appreciate some example code for this. Thanks
okhayat replied on at Permalink Reply
That's it! You should also include the .css in this block or another similar block, to be able to easily edit it.
jbx replied on at Permalink Best Answer Reply
if (!$c->isEditMode()) {
    $html = Loader::helper('html');
    $this->addHeaderItem($html->javascript($this->getThemePath() . '/accordion.js'));

Note the exclamation mark before the $c->isEditMode(). This will ensure that the code inside the braces only gets called if you're NOT editing the page.

Hope that helps...

richardacherki replied on at Permalink Reply
Thanks guys this was mighty helpful, it's all working perfectly now :)

Life savers :)

Just for anyone who is running into the same issue, remember to place this code where you were originally calling the script, i used:

<script type="text/javascript" src="<?php if (!$c->isEditMode()) { $this->addHeaderItem($html->javascript('includes/accordion.js'));}?>"></script>

in the header of my pagelayout file and it worked perfectly.