Adding unique IDs in xforms with JS

5 messages Options
Embed this post
Permalink
Stephanie Hall (TT)

Adding unique IDs in xforms with JS

Reply Threaded More More options
Print post
Permalink
Some javascript/style in this post has been disabled (why?)

Hi,

 

I am new to Orbeon and X-Forms, and in my application, I am trying to use javascript with my xforms to show/hide buttons for different instances in the repeats by putting them in divs.  Is there a way to assign a unique ID to the div specific to the index of the repeater?   They can’t be hard-coded.

 

So to loosely illustrate:

 

                <xforms:repeat id=”repeater”>

                                <my instance #1>

                                <my instance #2>

                                <my instance #3>

                                                <button onclick=”showDiv(“div_3”)”>

                                                <div id=”div_3”>…</div>

                </xforms:repeat>

 

I’ve tried to do something like ‘<div id="advancedSettings_<xforms:output value="count(preceding-sibling::component)+1"/>” style="display:none">’ but that doesn’t work.

 

Any help is greatly appreciated. Thanks!

Stephanie



--
You receive this message as a subscriber of the [hidden email] mailing list.
To unsubscribe: mailto:[hidden email]
For general help: mailto:[hidden email]?subject=help
OW2 mailing lists service home page: http://www.ow2.org/wws
Alessandro Vernet-2

Re: Adding unique IDs in xforms with JS

Reply Threaded More More options
Print post
Permalink
Stephanie,

On Mon, Oct 26, 2009 at 1:22 PM, Stephanie Hall (TT)
<[hidden email]> wrote:
>                                                 <div id=”div_3”>…</div>

You can just keep your div as is, and each iteration will
automatically have the id you specified followed by a separator,
followed by the index of the iteration (starting with 1). The
separator is a special character, and I recommend you use
XFORMS_SEPARATOR_1. So in JavaScript to access fourth iteration, you'd
write: "div_3" + XFORMS_SEPARATOR_1 + "4".

Alex
--
Orbeon Forms - Web forms, open-source, for the Enterprise
Orbeon's Blog: http://www.orbeon.com/blog/
My Twitter: http://twitter.com/avernet


--
You receive this message as a subscriber of the [hidden email] mailing list.
To unsubscribe: mailto:[hidden email]
For general help: mailto:[hidden email]?subject=help
OW2 mailing lists service home page: http://www.ow2.org/wws
Markku Laine

Re: Adding unique IDs in xforms with JS

Reply Threaded More More options
Print post
Permalink
In reply to this post by Stephanie Hall (TT)
Some javascript/style in this post has been disabled (why?)
Stephanie,


On 26.10.2009, at 22.22, Stephanie Hall (TT) wrote:

I am new to Orbeon and X-Forms, and in my application, I am trying to use javascript with my xforms to show/hide buttons for different instances in the repeats by putting them in divs.  Is there a way to assign a unique ID to the div specific to the index of the repeater?   They can’t be hard-coded.

In XForms, you can generate UUIDs as follows (or just use string( random(true))):
<xforms:output value="digest( string( random( true ) ), 'MD5', 'hex' )" />


-Markku


--
You receive this message as a subscriber of the [hidden email] mailing list.
To unsubscribe: mailto:[hidden email]
For general help: mailto:[hidden email]?subject=help
OW2 mailing lists service home page: http://www.ow2.org/wws
Stephanie Hall (TT)

RE: Re: Adding unique IDs in xforms with JS

Reply Threaded More More options
Print post
Permalink
In reply to this post by Alessandro Vernet-2
Thanks for the help, Alex.  What about when you don't know what index you're accessing?  So each row will have a button to do something in javascript with its div and that button will need to be created with each repeat.

So on the third repeat, something like
<xf:repeat>
        .
        .
        .
        <tr>
                <div id="div(dot)3"> //so the (dot)3 will automatically be created as the repeater repeats.
                        {stuff}
                </div>
                <button onclick="toggleSection(????)"/>  
        </tr>
</xf:repeat>

How can I access that "3" to put in my JS toggleSection function?  Using document.getElementById('div'+XFORMS_SEPARATOR_1+index('project-repeat'))) does not work as it does not recognize the "index('project-repeat')".

-----Original Message-----
From: Alessandro Vernet [mailto:[hidden email]]
Sent: Monday, October 26, 2009 8:53 PM
To: [hidden email]
Subject: [ops-users] Re: Adding unique IDs in xforms with JS

Stephanie,

On Mon, Oct 26, 2009 at 1:22 PM, Stephanie Hall (TT) <[hidden email]> wrote:
>                                                 <div
> id="div_3">...</div>

You can just keep your div as is, and each iteration will automatically have the id you specified followed by a separator, followed by the index of the iteration (starting with 1). The separator is a special character, and I recommend you use XFORMS_SEPARATOR_1. So in JavaScript to access fourth iteration, you'd
write: "div_3" + XFORMS_SEPARATOR_1 + "4".

Alex
--
Orbeon Forms - Web forms, open-source, for the Enterprise Orbeon's Blog: http://www.orbeon.com/blog/ My Twitter: http://twitter.com/avernet


--
You receive this message as a subscriber of the [hidden email] mailing list.
To unsubscribe: mailto:[hidden email]
For general help: mailto:[hidden email]?subject=help
OW2 mailing lists service home page: http://www.ow2.org/wws
Alessandro Vernet-2

Re: RE: Re: Adding unique IDs in xforms with JS

Reply Threaded More More options
Print post
Permalink
Stephanie,

On Wed, Oct 28, 2009 at 7:15 AM, Stephanie Hall (TT)
<[hidden email]> wrote:

> Thanks for the help, Alex.  What about when you don't know what index you're accessing?  So each row will have a button to do something in javascript with its div and that button will need to be created with each repeat.
>
> So on the third repeat, something like
> <xf:repeat>
>        .
>        .
>        .
>        <tr>
>                <div id="div(dot)3"> //so the (dot)3 will automatically be created as the repeater repeats.
>                        {stuff}
>                </div>
>                <button onclick="toggleSection(????)"/>
>        </tr>
> </xf:repeat>
>
> How can I access that "3" to put in my JS toggleSection function?  Using document.getElementById('div'+XFORMS_SEPARATOR_1+index('project-repeat'))) does not work as it does not recognize the "index('project-repeat')".
You can do the following: In the onclick, "this" will point to the
button. So you can pass it to toggleSection: toggleSection(this), and
in that function look for the div before the <button> and find that ID
for that div.

Alex
--
Orbeon Forms - Web forms, open-source, for the Enterprise
Orbeon's Blog: http://www.orbeon.com/blog/
My Twitter: http://twitter.com/avernet


--
You receive this message as a subscriber of the [hidden email] mailing list.
To unsubscribe: mailto:[hidden email]
For general help: mailto:[hidden email]?subject=help
OW2 mailing lists service home page: http://www.ow2.org/wws