• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 622
  • Last Modified:

Coldfusion - linking to a specific cflayoutarea tab via url

I have a cflayout with three tabs, is there a way for me to link to a specific tab from a url.

So when the page opens the first tab is always displayed, is there a way for me to link from other pages to so that it opens up with tab 2 or tab 3.
<cflayout type="tab" tabHeight="100%">
<cflayoutarea title="tab1">	
tab content	
</cflayoutarea>
 
<cflayoutarea title="tab2">
tab content
</cflayoutarea>
 
<cflayoutarea title="tab3">
tab content
</cflayoutarea>
 
</cflayout>

Open in new window

0
CurtinProp
Asked:
CurtinProp
  • 2
1 Solution
 
duncancummingCommented:
This solution lifted from:
http://www.coldfusionjedi.com/index.cfm/2009/1/9/Ask-a-Jedi-cfdiv-cfform-cflayout-and-selecting-tabs--also-a-new-bug

Links:
<a href="page.cfm?tab=1">tab 1</a>, <a href="page.cfm?tab=2">tab 2</a>, <a href="page.cfm?tab=3">tab 3</a>

Code:


<cfparam name="URL.tab" default=1>
 
<cfset t1Selected = false>
<cfset t2Selected = false>
<cfset t3Selected = false>
 
<cfswitch expression="#URL.tab#">
	<cfcase value="1">
		<cfset t1Selected = true>
	</cfcase>
	<cfcase value="1">
		<cfset t2Selected = true>
	</cfcase>
	<cfcase value="1">
		<cfset t3Selected = true>
	</cfcase>
</cfswitch>
 
<cflayout type="tab" tabHeight="100%">
<cflayoutarea title="tab1" selected="#t1Selected#">     
tab content     
</cflayoutarea>
 
<cflayoutarea title="tab2" selected="#t2Selected#">
tab content
</cflayoutarea>
 
<cflayoutarea title="tab3" selected="#t3Selected#">
tab content
</cflayoutarea>
</cflayout>

Open in new window

0
 
duncancummingCommented:
Sorry, minor mistake in my switch statement:

<cfparam name="URL.tab" default=1>
 
<cfset t1Selected = false>
<cfset t2Selected = false>
<cfset t3Selected = false>
 
<cfswitch expression="#URL.tab#">
        <cfcase value="1">
                <cfset t1Selected = true>
        </cfcase>
        <cfcase value="2">
                <cfset t2Selected = true>
        </cfcase>
        <cfcase value="3">
                <cfset t3Selected = true>
        </cfcase>
</cfswitch>
 
<cflayout type="tab" tabHeight="100%">
<cflayoutarea title="tab1" selected="#t1Selected#">     
tab content     
</cflayoutarea>
 
<cflayoutarea title="tab2" selected="#t2Selected#">
tab content
</cflayoutarea>
 
<cflayoutarea title="tab3" selected="#t3Selected#">
tab content
</cflayoutarea>
</cflayout>

Open in new window

0

Featured Post

Receive 1:1 tech help

Solve your biggest tech problems alongside global tech experts with 1:1 help.

  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now