Example for Hiding fr:tab

Hi All,

Could any one guide me or point me to an example of hiding/showing fr:tab based on user click

I'm referring to this link http://wiki.orbeon.com/forms/doc/developer-guide/xbl-components/tab-view#TOC-Hiding-and-disabling-tabs

eg: There are 4 tabs in a <fr:tabview>, on click of "Button A" I would like to show tab 1,3,4 on click on "Button B", I would like to show tab 2,3,4 and hide 1.

Thanks in advance
--SD

SD,

By "show tab 1,3,4", I assume you mean "make accessible/visible", not "make current", since only one tab can be the current one at any given point in time. To do the former:

1. You need an instance with one element per tab. Say those elements are <tab position="1"> (with 1, 2, 3…).
2. You make the element relevant if it contains the value 'true' with <xforms:bind nodeset="tab" relevant=". = 'true'"/>
3. On click on button A, you run 3 <xforms:setvalue ref="tab[@position = '1']" value="'true'"/> (and again with 3, 4).

Alex

Thanks Alex,

This was my approach.

I created 2 instances

<xforms:instance id="juggle-tab">
        <root>
                <tab-1/>                               
        </root>
</xforms:instance>       
                               
<xforms:instance id="juggle-template">
        <root>
                <tab-1/>
                <tab-2/>
        </root>
</xforms:instance>

Then I create binds as shown below

<xforms:bind id="bind-tab-1" nodeset="instance('juggle-tab')/tab-1"/>                       
<xforms:bind id="bind-tab-2" nodeset="instance('juggle-tab')/tab-2"/>

In the html body, the tabs looks like this

<fr:tabview>
     <fr:tab id="tab-1" bind="bind-tab-1">....</fr:tab>
     <fr:tab id="tab-2" bind="bind-tab-2">....</fr:tab>
     <fr:tab id="tab-3">....</fr:tab>
     <fr:tab id="tab-4">....</fr:tab>
</fr:tabview>

*Note: for tab-3 and tab-4 we don't need any binding cause we show them for both click of Button A and Button B.

On click of Button A, the following happens
<fr:button>
     <xforms:label>Button A</xforms:label>
     <xforms:action ev:event="DOMActivate">
            <xforms:insert nodeset="instance('juggle-tab')" origin="instance('juggle-template')"/>       
            <xforms:delete nodeset="instance('juggle-tab')/tab-2"/>
            <xforms:dispatch targetid="tab-1" name="fr-toggle"/> 
     </xforms:action>
</fr:button>

and on click of Button B,
<fr:button>
     <xforms:label>Button B</xforms:label>
     <xforms:action ev:event="DOMActivate">
            <xforms:insert nodeset="instance('juggle-tab')" origin="instance('juggle-template')"/>       
            <xforms:delete nodeset="instance('juggle-tab')/tab-1"/>
            <xforms:dispatch targetid="tab-2" name="fr-toggle"/> 
     </xforms:action>
</fr:button>

regards
--SD

Hi SD,

This is a good alternative. In both cases we have fr:tab bound to different nodes, but I was making those nodes relevant or non-relevant with an <xforms:bind relevant="…"> and you are removing/adding those nodes from the instance.

Alex

Alex,

I never noticed this until recently that the above code works on all browsers except IE8. On IE8, only tab-3 and tab-4 are visible. I'm on Orbeon Forms v 3.9.0.post.201109150100 CE.

Any clue on this issue?

Thanks
--SD

SD,

Could you create a standalone, minimal example that shows this issue
on IE8, maybe reusing some of the code in this thread? Then if you
attach it to your response here, we should be able to take care of
this for you.

Alex

On Mon, Sep 26, 2011 at 9:11 AM, SD [via Orbeon Forms (ops-users)]
<[hidden email]> wrote:

--
Orbeon Forms - Web forms, open-source, for the Enterprise -
http://www.orbeon.com/
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

Hi Alex,

Thanks for your prompt reply. I have attached a standalone code which might help. fr-tab

regards
--SD

SD,

Nice catch. This is now fixed, and the fix is in the latest nightly.
For reference:

https://github.com/orbeon/orbeon-forms/commit/d7504f44c03d181d6e29bb6fe1d2c454d935ebdb
http://forge.ow2.org/tracker/index.php?func=detail&aid=316196&group_id=168&atid=350207

You'll let us know if this works for you,

Alex

On Mon, Sep 26, 2011 at 11:03 AM, SD <[hidden email]> wrote:

--
Orbeon Forms - Web forms, open-source, for the Enterprise -
http://www.orbeon.com/
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

It worked . Thanks Alex

regards
--SD

SD,

Excellent; thank you for confirming this.

Alex

On Tue, Sep 27, 2011 at 7:31 AM, SD [via Orbeon Forms (ops-users)]
<[hidden email]> wrote:
--
Orbeon Forms - Web forms, open-source, for the Enterprise -
http://www.orbeon.com/
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

Hi Alex,

I see the same behavior on IE8 again. I'm on Orbeon Forms 3.9.0.201105152046 CE

Thanks
--SD

Hi SD,

I reopened this for now, and will look into it.

https://github.com/orbeon/orbeon-forms/issues/123

Alex

On Fri, Apr 13, 2012 at 11:49 AM, SD [via Orbeon Forms (ops-users)]
<[hidden email]> wrote:

--
Follow Orbeon on Twitter: @orbeon
Follow me on Twitter: @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

Hi SD,

I don't seem to be able to reproduce this. I am running the following
on IE8 with a nightly build:
http://localhost:8080/orbeon/xforms-sandbox/run?url=https://raw.github.com/gist/2415656/gistfile1.xml

If I click Button B, tab "two" shows and tab "one" becomes hidden. And
vice versa happen if I click Button A. Do you see a different behavior
with nightly builds?

Alex

On Tue, Apr 17, 2012 at 10:45 AM, Alessandro Vernet <[hidden email]> wrote:

--
Follow Orbeon on Twitter: @orbeon
Follow me on Twitter: @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

Hi Alex,

Thanks for your response. I'm still facing the issue. I downloaded the latest Nightly Build (Orbeon Forms 3.9.0.post.201204170228 CE), and the tab are behaving differently on IE8.

Please find the sample source code along with screen shot when Button Ais pressed, and when Button B is pressed.

Thanks
--SD

Hi Alex,

Do we have any workaround for this issue.

Thanks
--SD