Home/ Questions/Q 8105005
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-06T00:03:29+00:00

I am building a custom control using the accordion control included with the Xpages

  • 0

I am building a custom control using the accordion control included with the Xpages Extension Library. I am attempting to bind to the AccordianPane id and I receive the error:

The value of the property id cannot be a run time binding

The error is referring to this line of code:

<xe:djAccordionPane
              title="#{javascript:sectiontitles.getColumnValue('Section')}" id="#{javascript:sectiontitles.getColumnValue('Section')}"
                parseOnLoad="false">

I saw Paul Withers post here:

http://www.intec.co.uk/combining-and-an-alternative-approach/
Which makes me think this is possible and that I am just not quite there. Where do I use $ instead of # ?

Here is the code I am using:

<?xml version="1.0" encoding="UTF-8"?>
<xp:view xmlns:xp="http://www.ibm.com/xsp/core"
    xmlns:xe="http://www.ibm.com/xsp/coreex">
    <xp:this.data>
        <xp:dominoView var="view1" viewName="MenuLinks"></xp:dominoView>
        <xp:dominoView var="view2" viewName="MenuLinksSections"></xp:dominoView>
    </xp:this.data>

    <xp:panel
        style="float:left;padding-left:20.0px;padding-right:20.0px; padding-top:20.0px">



        <xe:djAccordionContainer id="djBorderContainer1"
            style="width:200px; height:540px" styleClass="soria">
            <xe:this.selectedTab><![CDATA[#{javascript:var selectedTab = context.getUrlParameter("tab");
if (selectedTab == "") {
""
} else {
selectedTab
}
}]]></xe:this.selectedTab>

            <xp:repeat id="repeat1" rows="30" var="sectiontitles"
                value="#{view2}" disableOutputTag="true">

                <xe:djAccordionPane
                    title="#{javascript:sectiontitles.getColumnValue('Section')}" **id="#{javascript:sectiontitles.getColumnValue('Section')}"**
                    parseOnLoad="false">


                    <xp:text escape="true" id="computedField1">
                        <xp:this.value><![CDATA[#{javascript:var id = "#{id:djAccordionPane}";
id}]]></xp:this.value>
                    </xp:text>
                    <xp:text escape="true" id="computedField2"></xp:text>
                    <xp:repeat id="repeat2" rows="30" var="menulinks"
                        disableTheme="true">
                        <xp:this.value><![CDATA[#{javascript:var tview = database.getView("MenuLinks");
var v = sectiontitles.getColumnValue("unid");
var vc:NotesViewEntryCollection = null;
if (v != null) {

    vc = tview.getAllEntriesByKey(v);
}
vc
}]]></xp:this.value>

                        <xp:text escape="false">
                            <xp:this.value><![CDATA[#{javascript:menulinks.getColumnValues()[3]}]]></xp:this.value>
                        </xp:text>

                    </xp:repeat>
                </xe:djAccordionPane>
            </xp:repeat>

        </xe:djAccordionContainer>
    </xp:panel>


</xp:view>

Any help is appreciated.

Thanks,

Elijah Lapson

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    It’s almost certainly the id property that cannot be a runtime binding. That’s because the ID is used by the server to create a map of the elements on the XPage. So it cannot be calculated dynamically using the #.

    You won’t be able to use $ within the repeat unless repeatContents property is set to true. The $ means it will try to calculate the ID at page load, but the number of elements in the repeat will not have been calculated yet. They’ll be calculated dynamically. So you’ll need repeatContents=”true” on the repeat, so the repeat control’s contents are calculated at page load. The repeatControls property can have knock-on implications to things like paging, but it doesn’t sound like that’s going to be a problem for you.

    However, why are you trying to compute the ID? Is it so you can use the ID somewhere in CSJS to get a handle on each individual element? If so, an alternative may be to add a normal HTML element like a div within the djAccordionPane and compute the ID of that. You will not have runtime binding issues with that. Alternatively compute the styleClass property instead. Then you can use dojo.query to select the elements based on the class property. You should be able to use dojo.query(.#{javascript:sectiontitles.getColumnValue(‘Section’)}) to get a handle on the element with the class that matches sectiontitles.getColumnValue(‘Section’)

    • 0