Feature Req: Ability to use CFGrid in Tabbed Panels.
Currently, there is no way to use a data grid in a tabbed
panel in cold fusion ... this is really sad. I hope in the future,
you can do such a thing ..
Now this may be a little misleading. But as if CF 8.0.1, if
you place a CF grid into a spry panel, you cannot see any data
until you click on a column header to sort by that column. At that
time, the grid will expand to show all columns, and rows of data.
Until then, cfgrid refuses to show anything.
> Currently, there is no way to use a data grid in a
tabbed panel in cold fusion
Really? What makes you say that?
[code]
<cfscript>
// mock-up some data
q = queryNew("id,firstName,lastName");
queryAddRow(q); querySetCell(q, "id", 1); querySetCell(q,
"firstName",
"Adam"); querySetCell(q, "lastName", "Cameron");
queryAddRow(q); querySetCell(q, "id", 2); querySetCell(q,
"firstName",
"Jane"); querySetCell(q, "lastName", "Smith");
queryAddRow(q); querySetCell(q, "id", 3); querySetCell(q,
"firstName",
"Bob"); querySetCell(q, "lastName", "Brown");
queryAddRow(q); querySetCell(q, "id", 3); querySetCell(q,
"firstName",
"Sarah"); querySetCell(q, "lastName", "Williams");
</cfscript>
<cfform method="post" action="#CGI.script_name#"
format="flash">
<cfformgroup type="tabnavigator">
<cfformgroup type="page" label="Grid Tab">
<cfgrid name="myGrid" format="Flash" query="q"
selectmode="edit"/>
</cfformgroup>
<cfformgroup type="page" label="Another Tab">
<cfinput type="text" name="someText" />
</cfformgroup>
</cfformgroup>
<cfinput type="submit" name="submit" value="Submit" />
</cfform>
<cfif structKeyExists(form, "fieldNames")>
<cfdump var="#form#">
</cfif>
[/code]
Seems to work OK to me. Am I misreading your statement?
Adam
Similar Messages
-
Can you use anchors with tabbed panels???
Im trying to use anchors with tabbed panels but they dont seem to work. I need to be able to link to specific tabs and specific areas within those tabs, but I haven't been able to find a way to do this. Does anyone know or have a work around?
Yes, that is an improvement in Muse, check release notes here, http://forums.adobe.com/message/5104247 - Widget Improvements
The selected tab in Design view for the Tabbed panel widget will now be selected/active when previewing, exporting or publishing the site to Business Catalyst.
- Abhishek Maurya -
Difficultly using functions of tabbed panels
Hello everyone I have a problem. I am not sure how well I can
explain this because I am a beginner programmer. Anyway here goes.
I have oscommerce that I an modifying to suit my business
needs.
I put in a set of tabbed panels that are created off of
values coming from a Mysql dbase.
When a user makes changes to these tabbed panels I need to
pull the changes they made from the tabbed panels.
I got all the panels built and radio buttons made on each
tab. If a user selects one of the radio buttons I can successfully
update the dbase accordingly.
However I need to know which tab the user clicks on. I
believe that I can use the function getCurrentTabIndex() to do
this.
But I am not sure where in my code that this needs to be.
Can anyone help me out?
thanksquote:
Originally posted by:
karozans
Hello everyone I have a problem. I am not sure how well I can
explain this because I am a beginner programmer. Anyway here goes.
I have oscommerce that I an modifying to suit my business
needs.
I put in a set of tabbed panels that are created off of
values coming from a Mysql dbase.
When a user makes changes to these tabbed panels I need to
pull the changes they made from the tabbed panels.
I got all the panels built and radio buttons made on each
tab. If a user selects one of the radio buttons I can successfully
update the dbase accordingly.
However I need to know which tab the user clicks on. I
believe that I can use the function getCurrentTabIndex() to do
this.
But I am not sure where in my code that this needs to be.
Can anyone help me out?
thanks
well im actually working on the same thing atm. atleast the
same concept.
I have add a function on the tabs, so when they click it
fires the check function;
<div class="TabbedPanels" id="tp1">
<ul class="TabbedPanelsTabGroup">
<li onclick="loadContent();">tab0
</li>
<li onclick="loadContent();">tab1
</li>
<li onclick="loadContent();">tab2
</li>
<li onclick="loadContent();">tab3
</li>
</ul>
^ like that.
function loadContent(){
// other function code like updatecontent that i have heere
setTimeout('checkTab();',0); // this is what its all about ..
function checkTab(){
var curIndex = tp1.getCurrentTabIndex();
if(curIndex == 0){ // if its pannel nr 0
do something
}else if(curIndex == 1){ // if its pannel nr 1
do something when user comes to pannel 1
}else if (curIndex > 1 ){
they press a pannel greater than pannel 1, it will fire
this;
maby it will help u out.. atleast it works for me :)
i use that code to show and hide certain buttons on the page. -
Using Images for Tabbed Panels
I'm trying to use button images that I created in photopshop as the background for the tabs of my tabbed panel widget in dreamweaver. I tried this by inserting the folling code into the css (note bold line):
.TabbedPanelsTab {
position: relative;
top: 1px;
float: left;
padding: 4px 10px;
margin: 0px 1px 0px 0px;
font: bold 0.9em sans-serif;
background-image:url(images/tabs.gif);
list-style: none;
-moz-user-select: none;
-khtml-user-select: none;
cursor: pointer;
color: #FFF;
I also tried using background:url(images/tabs.gif) in place of background-image:url(images/tabs.gif) but it still won't work. What do I need to know about using images for my tabs?Have a look here
http://www.adobe.com/devnet/dreamweaver/articles/spry_widgets_design.html -
Can I use Spry Tabbed Panels to create a multi page form?
I'm trying to setup a multi page form and have been unsuccessful using PHP Sessions.
Would it be possible to use the Spry Tabbed Panels in DW CS3 and divide the different sections of the form in the panels? My thought is to have the Form Element around the main Tab Div and the submit button at the end of the form. Would this work?
If so, is there a way to have a "Next" button that will activate the next Tab so that the user can easily tab through each form field and easily go to the next tab to help with usability?Beth, thank you! I was able to get the tabs to advance using your suggested
on the right: "Next Panel"
<a href="#" onclick="TabbedPanels1.showPanel(2); return false;">Next Panel</a>
In order to make it more graphical, I added a Next Button as suggested in the "Open Tabs Programatically" info at http://labs.adobe.com/technologies/spry/articles/tabbed_panel/index.html
<button onclick="TabbedPanels1.showPanel(0)" >open first panel</button>
<button onclick="TabbedPanels1.showPanel('tabID')">open panel</button>
<script type="text/javascript">
var TabbedPanels1 = new Spry.Widget.TabbedPanels("TabbedPanels1");
</script>
When I add the above code, when I clicked on the Next Button, it would submit the form. After looking at the Text Code, I noticed the Button Code did not have the ;return false; in the code so once I added that, the buttons now work as I want them to.
Take a look at http://www.soleproductions.com/oakley/tabform.php
Now that I have the basic setup, I can begin to setup the actual Online Application.
Thanks again for everyone's help. I guess I was looking for the WISIWIG way to do it since I'm not very good at hand coding. -
Content Rotator vs. Tabbed Panels
Hey Guys,
I've got the following HTML/Spry content rotator:
http://www.glmmrs.com/temp/contentrotator.html
As it stands now, it rotates by itself and cycles through the
tabs without any problems. If I turn off the "cycle.start()"
function call in the body tag, I can correctly click through the
1-5 tabs and view the content independently without a problem.
However I cannot get both to work together Clicking on the tab
links when the content is rotating throws everything off, and I
haven't been able to get it to work correctly. I have the following
JS which handles the cycling of the content here:
http://www.glmmrs.com/temp/spry/customSpry.js
And the clicking of the panels independently is handled
within:
http://www.glmmrs.com/temp/spry/SpryTabbedPanels.js
So my question is - how can I get these two to work together?
Any suggestions would be greatly appreciated.
Thank you.Hi kfratomatic84,
I'm planning on integrating the content rotating feature into
the next version of the tabbed panels. I've written an extension
for the 1.6.1 version of the SpryTabbedPanels.js that gives folks
the same functionality. Rather than using the rotator I posted a
long time ago, try using this in conjunction with your
SpryTabbedPanels.js and SpryEffect.js:
http://www.shinarp.com/SprySamples/tabbedpanels/tabbed_panel_sample3_files/SpryTabbedPanel sExtensions.js
You can see how to start the content rotating here:
http://www.shinarp.com/SprySamples/tabbedpanels/tabbed_panel_sample3.htm
If you click on a tab while the content is rotating, it
automatically stops the rotation, and you will have to restart it
with a call to tp.start() if you want it to continue.
--== Kin ==-- -
Placing an image in a tabbed panel content area, it shows up on all three panels
This is crazy. It should be so simple. But sometimes this happens to me. Like today.
I have many pages that use a simple tabbed panel feature with three tabs.
Each content area has a text frame and an image frame.
Sometimes when I try to place an image into the content area of the first tab, the image shows up on all three content areas. I have tried and tried placing the image, making very sure I am in the "content area" on not just on the page. But nevertheless, the image seems to be "stuck" on the page, in front of the accordian feature, and therefore showing on all three tabs.
How am I not targeting the placement of those images correctly? There just aren't that many options for me to screw up, it's a simple tabbed panel, that's all!
Help please.
BarbaraAre you using the latest version of Muse/Air?
The borders of the Content Area of a tab gets highlighted as soon as you drag over an element over it so it is very unlikely that something like this could happen. However, I believe it could be due to messed up Layers configuration as the only way I could reproduce this problem is through moving the image into a layer above a layer that contains the Tabbed panel or in case of just one layer, you might have the image at the very top.
Thanks,
Vinayak -
Spry Validation in Tabbed Panel
I've created a form that has a number of sections which I
have separated out using a spry tabbed panel. So far, so good.
On one of the panels, however, is a select box that is
required, so I have used a spry validation widget to look after it.
Now, if the select box hasn't been used then and the submit button
is clicked while one of the other panels is open, because the
validation widget halts the form it makes it look as though nothing
has happened. The warning message is only visible when the correct
panel is open.
My question is this: how do I either (a) force the panel with
the error on to reopen or (b) make the error message show up
elsewhere on the page so that it is visible? I tried positioning it
absolutely above the whole panel but it still only shows up when
the relevant panel is oen.I have actually added multiple tabbed panels inside of tabbed
panels as well as collapsible panels inside of tabbed panels and
vise versa. This works across all browsers (IE 6 & 7, FF 2,
Safari 2 & 3).
The key for me was to use <div style="clear: both"> (I
put a comment here to satisfy IE6) </div> at the bottom of
the tab, before the closing of the tab since I was using a lot of
floating within the tabbed panels.
If you share some code, I'm sure someone could give you a
more specific answer. -
??Spry Tabbed panels funny in Firefox
Hello, I am using the Spry tabbed panels in Dreamweaver CS4 and when I render in firefox there is a large amount of space at the bottom as if the tabbed panels are allowing space for each subsequent tab - even though the text is in the next tab.
http://www.patternsoftheweb.net/1.htm
The page link above shows the problem. How do I get rid of the extra space?
Thank you for your help!I think your are referring to the css attribute: outline:none;
Added outline:none; to the css rule and it should be gone. -
Spry Tabbed Panels Keep Shifting
I have built a page using the Spry Tabbed Panels. I have one
set inside of another. The problem is when you click a main tab and
then a secondary tab and then roll over the main tabs again the
width changes on the secondary tab. I have no idea why it does
this. Here is the link:
http://www.pco2.com/v/vspfiles/downloadables/spry/Tabbed_Page_3.html
Thanks in advance.I would have to say that I am not sure it is a good idea to
be using the tabs spry function as a navigation system. It is not
what it was intended for. This puts your entire web site on one
HTML page. If you lots of images, this could be a rather large
download. Downloading an entire web site before you can see just
one page is not very efficient. You are better off, IMHO, to use
the SPRY tabs sparingly and where they are conducive to the content
and not as site navigation.
My $0.02 -
Spry Tabbed Panels - Contribute Error Message
I created a Web site using Dreamweaver CS4 that uses a Spry Tabbed Panels. It works fine, but so far it fails when it is pulled into Contribute CS5. I've read the posts about allowing Spry Widget editing in Contribute, so I've turned on that capability.
When I try to launch the Spry Widget Properties from within Contribute, I get this error:
"This tabbed panel is missing its content. Contact your administrator to add the missing content panel, or delete this panel and insert a new one."
I've tried creating new generic pages with new Spry tabbed panels, but they always fail with this message.
Here is a sample page:
http://www.dougriderconsulting.com/zmcpa/incentives.html
Any ideas? Thanks!The page http://www.dougriderconsulting.com/zmcpa/incentives.html mentioned here has no issues.
If there are any missing codes DW also shows the error as <missing content panel> or <missing tab> when the Tabbed Panel widget is selected.
In Contribute the same pops up as a message.
The issue in page http://www.dougriderconsulting.com/zmcpa/education_in_muskingum_county.html posted in Contribute Blogs is re-solved http://blogs.adobe.com/contribute/2010/06/spry_widget_rendering.html#more-33. -
Hi,
I've been using the DW CS4 "Spry Tabbed Panels" on a few pages. When I validate the website (with DW tool for that), I get the following messages for each use of the tabbed panels: The tag: "li" doesn't have an attribute: "tabindex" in currently active versions. [XHTML 1.0 Transitional].
Should I worry about this? I'd like to have a code as clean and XHTML valid as possible. Is there a way to fix this so the message doesn't come up anymore?
Emilie
Example of code this message is linked to:
<div class="TabbedPanels" id="TabbedPanelsADMS">
<ul id="TabUL" class="TabbedPanelsTabGroup">
<li id="TabLI1" class="TabbedPanelsTab" tabindex="0">About</li>
<li id="TabLI2" class="TabbedPanelsTab" tabindex="0">Assets</li>
<li id="TabLI3" class="TabbedPanelsTab" tabindex="0">Input</li>
<li id="TabLI4" class="TabbedPanelsTab" tabindex="0">Output</li>
<li id="TabLI5" class="TabbedPanelsTab" tabindex="0">Support</li>
<li id="TabLI6" class="TabbedPanelsTab" tabindex="0">Purchase</li>
</ul>
<div class="TabbedPanelsContentGroup">
<!-- TabLI About -->
<div class="TabbedPanelsContent">
<!-- end #TabbedPanelsContent TabLI About -->
</div>
<!-- TabLI Assets -->
<div class="TabbedPanelsContent">
<!-- end #TabbedPanelsContent TabLI Assets -->
</div>
<!-- TabLI Input -->
<div class="TabbedPanelsContent">
<!-- end #TabbedPanelsContent TabLI Input -->
</div>
<!-- TabLI Output -->
<div class="TabbedPanelsContent">
<!-- end #TabbedPanelsContent TabLI Output -->
</div>
<!-- TabLI Support -->
<div class="TabbedPanelsContent">
<!-- end #TabbedPanelsContent TabLI Support -->
</div>
<!-- TabLI Purchase -->
<div class="TabbedPanelsContent">
<!-- end #TabbedPanelsContent TabLI Purchase -->
</div>
<!-- end #TabbedPanelsContentGroup -->
</div>
<!-- end #TabbedPanelsADMS -->
</div>Should I worry about this? I'd like to have a code as clean and XHTML valid as possible. Is there a way to fix this so the message doesn't come up anymore?
If validation is important to you, you need to remove tabindex. Should you worry about it? Not really. Sometimes it makes sense to ignore validation to achieve a particular goal, which is why Spry widgets use tabindex in a technically invalid way.
The explanation as to why Spry does that can be found here: http://blogs.adobe.com/spryteam/2007/03/spry_widgets_and_tab_index.html. -
Spry Tabbed Panels - not correct in IE but correct in Chrome and MF
Hi,
I'm having problems with an extension I used for a client, so I want to use the Spry tabbed panels form dreamweaver, but they in IE8 it puts all the content under each other in the first tab ??
In Chrome and MF its correct. Do you know about this problem or is it because I did something wrong?
see: www.zorgfilosofie.nl/index2
The other pages where made with an extension but with that script my client can't edit with contribute. That's why I want to implement Dreamweaver Spry Tabbed Panels.
Thanks for answering!
CarlaHello there from down under J
Het was mooi weer, maar vandaag regent het.
Toch zijn hier in deze kamer veel zonnestralen, want het probleem is opgelost!
I searched the whole evening for alternative but it did’t work with templates.
With the js files the problem is solved.
I don’t understand why the js file was not correct, because I just bought CS5.5
Where do I have to put de file so the problem will not happen again when I make another site?
Thanks a lot!
Best regards and take some sun with you!
Carla
Van: altruistic gramps [email protected]
Verzonden: woensdag 5 oktober 2011 2:16
Aan: Carla Leliveld
Onderwerp: Spry Tabbed Panels - not correct in IE but correct in Chrome and MF
Re: Spry Tabbed Panels - not correct in IE but correct in Chrome and MF
created by altruistic gramps <http://forums.adobe.com/people/altruistic+gramps> in Spry Framework for Ajax - View the full discussion <http://forums.adobe.com/message/3954185#3954185 -
Remembering which tabbed panel I left
I have a web page that uses several Spry tabbed panels to display different sub-sets of volunteers who have applied to volunteer at an airshow. Alongside each volunteer is a link to a page that allows an administrator to edit the volunteer information, that is the user could have started from any one of 4 tabs and gone to the same page to edit the volunteer info. When the edit is complete it returns to the original web page and opens the default tab, I'd like it to return to the original web page and open the tab it left. I have read http://foundationphp.com/tutorials/spry_url_utils.php and think I understand it, but before I can do that I need to pass the tab number from the original page to the edit page, and then when the edit is complete pass that back to the original page.
I think I know how to pass the tab number to the edit page - I'd add &tab=x to the link URL (where "x" is the tab number I'm leaving). The problem I'm having is figuring out how to access that parameter in the edit page and then send it back when the edit is complete.
To see what I mean look at www.hollisterairshow.com/login.php and use username "q" and password "q" without the quotes, this will take you to the Control Panel or "original web page" I referred to above. Look at any/all of the "Volunteer" tabs and you'll see they all provide a link to an "editvolunteer.php" page. When the edit is complete I'd like the user to be returned to the Control Panel and in the tab they were in.
Thanks for any suggestions,
TonyHi Tony,
You will need to use cookies for this. Normally I point to Arnout Kazemier's page for this but it has been down for some time now.
Dooza(Steve) seems to have found a solution, just not sure what, but have a look here http://forums.adobe.com/message/3281366#3281366
If you send Steve a PM he will probably help you out.
Ben
PS: in case you need it, the following is SpryCookie.js
Spry.Utils.Cookie = function(type /* string*/, name /* string */, value /* string or number */, options /* object */){
var name = name + '=';
if(type == 'create'){
// start cookie string creation
var str = name + value;
// check if we have options to add
if(options){
// convert days and create an expire setting
if(options.days){
var date = new Date();
str += '; expires=' + (date.setTime(date.getTime() + (options.days * 86400000 /* one day 24 hours x 60 min x 60 seconds x 1000 miliseconds */))).toGMTString();
// possible path settings
if(options.path){
str += '; path=' + options.path
// allow cookies to be set per domain
if(options.domain){
str += '; domain=' + options.domain;
} else {
// always set the path to /
str += '; path=/';
// set the cookie
document.cookie = str;
} else if(type == 'read'){
var c = document.cookie.split(';'),
str = name,
i = 0,
length = c.length;
// loop through our cookies
for(; i < length; i++){
while(c[i].charAt(0) == ' ')
c[i] = c[i].substring(1,c[i].length);
if(c[i].indexOf(str) == 0){
return c[i].substring(str.length,c[i].length);
return false;
} else {
// remove the cookie, this is done by settings an empty cookie with a negative date
Spry.Utils.Cookie('create',name,null,{days:-1}); -
Spry Tabbed Panels and Master/ Detail Page Set interraction
Hi,
I have created a feedback form and am using a Spry Tabbed Panel to allow users to review all responses to one question and then all responses to the next question in different tabs, there are 6 tabs in all. In each tab I have created a Master/ Detail Page set - well actually just the Master appears in the tab. This is working fine. I allow up to 20 responses to be shown on each tab, after which the user selects First/Previous/Next/Last. When they do this the screen refreshes and the tabbed panel display goes back to the default tab, clicking on the tab previously used correctly displays whichever of First/Previous/Next/Last the user selected. I'd like the display to remain on the user's current tab when they select First/Previous/Next/Last.
The page in question is here http://www.hollisterairshow.com/feedback-results2.php, then scroll about half way down the page and select one of the tabs.
Thanks.
TonyHi Tony,
Look at the following, blue coded is comment only, red coded is what has to be added to your existing code and orange coded is added by the SpryDataSet creator if done properly. Where the orange part starts, thats where you place your cursor when creating the dataset.
<p> </p>
<div id="TabbedPanels1" class="TabbedPanels">
<ul class="TabbedPanelsTabGroup">
<li class="TabbedPanelsTab" tabindex="0">All feedback</li>
<li class="TabbedPanelsTab" tabindex="0">Suggestions for improvement</li>
<li class="TabbedPanelsTab" tabindex="0">What did you like the most</li>
<li class="TabbedPanelsTab" tabindex="0">What did you like the least</li>
<li class="TabbedPanelsTab" tabindex="0">What else would you like to see</li>
<li class="TabbedPanelsTab" tabindex="0">Any other comments</li>
</ul>
<div class="TabbedPanelsContentGroup">
<div class="TabbedPanelsContent">
<table border="1" align="center" id="allFeedback"> .... start feedback table tag (line 763)
<tr>
<td width="80"><strong>Feedback Number</strong></td>
<td><strong>Days attended</strong></td>
<td><strong>Arrived by</strong></td>
<td><strong>Arrival arrangements</strong></td>
<td><strong>Expectations met</strong></td>
<td><strong>Ticket price</strong></td>
<td><strong>Zip code</strong></td>
</tr>
.................... rest of table probably your PHP repeat area
</tr>
</table> .... end feedback table tag
<div spry:region="dsAllFeedback">
<table>
<tr>
<th spry:sort="Feedback_Number">Feedback Number</th>
<th spry:sort="Days_attended">Days attended</th>
<th spry:sort="Arrived_by">Arrived by</th>
<th spry:sort="Arrival_arrangements">Arrival arrangements</th>
<th spry:sort="Expectations_met">Expectations met</th>
<th spry:sort="Ticket_price">Ticket price</th>
<th spry:sort="Zip_code">Zip code</th>
</tr>
<tr spry:repeat="dsAllFeedback" spry:setrow="dsAllFeedback" spry:odd="row_odd" spry:even="row_even" spry:hover="row_hover" spry:select="row_select">
<td>{Feedback_Number}</td>
<td>{Days_attended}</td>
<td>{Arrived_by}</td>
<td>{Arrival_arrangements}</td>
<td>{Expectations_met}</td>
<td>{Ticket_price}</td>
<td>{Zip_code}</td>
</tr>
</table>
</div>
<br />
<table border="0">
I hope this helps.
Ben
Maybe you are looking for
-
I am using itunes 7 and have purchase a couple of games from the store. Itunes sticks them in the unknown artist folder in my library and then says it can't download them to my ipod because it can't find them!. The way i got around this was to delete
-
Atreyu The Best Of...
Hey guys. I have Atreyu's Best Of CD on my iPod. But there's a really weird problem where it only shows up in the Album view and it doesn't show Atreyu in the artists view. So any solutions?
-
I have just created a new role in BI 7 as Basic Reporting Role via PFCG. Following are the steps I used: 1) Create New Role in PFCG 2) In PFCG ->Authorization tab, click on Change Authorization Data icon. Then select Do Not Select Template. 3) Click
-
Can I get 3g ipad service that would work in both UK and France?
I have a 3G iPad 2. I just returned from Canada, where I was able to buy a microSIM from a local Bell store, put it into the iPad, and then purchase a month's worth of 3G service. It worked great, and was MUCH cheaper than using the AT&T internatio
-
Hi, I´m new at the community. My book about the life of a bull who died in a bull fight was a best seller in Perú, and is been studied in many schools there. But I don't live there any more. People ask me about the book and is not any more at the lib