Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations wOOdy-Soft on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

general question on table in <cfoutput> 2

Status
Not open for further replies.

eladi

Programmer
Sep 4, 2001
80
AU
hi all,

this is a general question on the attempt to realize a table output.

i'm displaying thumbnail pictures on a page. i want to put them in a table. always 4 in a row, then a new row 4 four and so on. it has to be dynamic, because there are not the same number of pictures in a section. i know how to creat new line for one db entry. but how do i put it an entry into a <td> tag and then make cf realize that a new line has to be created? do i have to work with <cfif>?

this is the sql-code:
<cfquery name=&quot;detailled&quot; datasource=&quot;travels&quot;>
select * from pictureDB where country = '#which#' order by descriptionShort
</cfquery>

does anyone have a tutorial?

tnx in advance.
adrian
 
Is this what you needed, to have it start a new row every 4 pictures?

<cfset min=1>
<cfset min=4>

<table>
<cfoutput query=&quot;detailled&quot;>
<tr>
<cfloop query=&quot;detailled&quot; startrow=&quot;min&quot; endrow=&quot;max&quot;>
<td> OUTPUT STUFF </td>
</cfloop>
</tr>
<cfset min = min + 4>
<cfset max = max + 4>
</cfoutput>
</table>
 
Intriguing, diggy, I've never seen it done that way.
The only drawback I see is, if the last loop doesn't have exactly 4 records, you'd get less than 4 table cells.

Technically, this is a violation of HTML... though it'd work in almost all the browsers today.

I've always done it like:
Code:
<CFSET cellnum = 1>
<CFSET cellmax = 4>

<table border=&quot;1&quot; cellspacing=&quot;5&quot; cellpadding=&quot;5&quot;>
<CFLOOP index=&quot;whichThumb&quot; query=&quot;#detailled#&quot;>
<CFIF cellnum GT cellmax>
</TR>
<CFSET cellnum = 1>
</CFIF>
<CFIF cellnum EQ 1>
<TR>
</CFIF>
<CFOUTPUT><td>#whichThumb#</td></CFOUTPUT>
<CFSET cellnum = cellnum + 1>
</CFLOOP>

<CFIF (detailled.RecordCount MOD cellmax) GT 0>
<CFLOOP index=&quot;orphancells&quot; from=&quot;#cellnum#&quot; to=&quot;#cellmax#&quot;>
<td>&nbsp;</td>
</CFLOOP>
</TR>
</CFIF>

</table>

But I have to say I like diggy's better. Hope it helps,
-Carl
 
hi diggy8,

this seems to be a good solution. i've put it in, but get always the same cf-error:

here the code as i put it into the file:

<cfset min=1>
<cfset max=4>
<table width=&quot;650&quot;>
<cfoutput query=&quot;detailled&quot;>
<tr>
<cfloop query=&quot;detailled&quot; startrow=&quot;min&quot; endrow=&quot;max&quot;>
<td><a href=&quot;worldAAp.cfm?pic=#id#&which=#country#&quot;><img src=&quot;images/small/#picSmall#&quot; border=&quot;0&quot;></a><br>
<span class=&quot;text&quot;> #descriptionShort#</span></td>
</cfloop>
</tr>
<cfset min = min + 4>
<cfset max = max + 4>
</cfoutput>
</table>

the error that i get is:

Attribute validation error for tag CFLOOP.
The value of the attribute ENDROW is invalid. The value cannot be converted to a numeric because it is not a simple value.Simple values are booleans, numbers, strings, and date-time values.

as i understand it, this is a data type error. but how could it be a wrong data type?

can anybody help me, please.
tnx in advance
adrian
 
I believe it's because you're not specifying the values as CF variables... but, rather, you're specifying strings. In other words... you forgot the pound signs [wink]

Code:
<cfset min=1>
<cfset max=4>
<table width=&quot;650&quot;>
<cfoutput query=&quot;detailled&quot;>
<tr>
<cfloop query=&quot;detailled&quot; startrow=&quot;
Code:
#min#
Code:
&quot; endrow=&quot;
Code:
#max#
Code:
&quot;>
<td><a href=&quot;worldAAp.cfm?pic=#id#&which=#country#&quot;><img src=&quot;images/small/#picSmall#&quot; border=&quot;0&quot;></a><br>
<span class=&quot;text&quot;> #descriptionShort#</span></td>
</cfloop>
</tr>
<cfset min = min + 4>
<cfset max = max + 4>
</cfoutput>
</table>
Hope it helps,
-Carl
 
tnx carl. what a dork i am.

now, i have another question. if i do it as above, it displays the pictures, but continous to display non-existing pics (you know, the infamous red x) and not even in rows but in collums. this runs on win98 and the cf mx studio. it seems to work correctly on the webserver though. this is not really important, i'm just curious.

tnx all for your help.
adrian
 
The non-existing pics are a bit of a problem... we can tackle that in a minute. But what do you mean &quot;not even in rows, but in columns&quot;?? How can you have columns, but not rows? Do you mean a single row? Something sounds like it might be wrong with the HTML itself.

As for the non-existing pics... the tact you take to fix this problem depends on your intended end-result.

If you only want to suppress the red-x bounding box, but still list the entry in the table, you could do something like:

Code:
<td><a href=&quot;worldAAp.cfm?pic=#id#&which=#country#&quot;><cfif FileExists(&quot;/webroot/etc/images/small/#picSmall#&quot;)><img src=&quot;images/small/#picSmall#&quot; border=&quot;0&quot;><cfelse><img src=&quot;images/small/nopic.gif&quot; border=&quot;0&quot; alt=&quot;No thumbnail available&quot;></cfif></a><br>
<span class=&quot;text&quot;> #descriptionShort#</span></td>

If you actually want to keep the entry from appearing in the table if the thumbnail doesn't exist, that's a little more complicated, and diggy's method of creating your rows probably would cease to work for you, since each loop expects there to be 4 columns.
You'd have to use something more akin to my earlier solution, like:

Code:
<CFSET cellnum = 1>
<CFSET cellmax = 4>

<table border=&quot;1&quot; cellspacing=&quot;5&quot; cellpadding=&quot;5&quot;>
<CFLOOP query=&quot;#detailled#&quot;>
  <cfif FileExists(&quot;/webroot/etc/images/small/#picSmall#&quot;)>
     <CFIF cellnum GT cellmax>
        </TR>
        <CFSET cellnum = 1>
     </CFIF>
     <CFIF cellnum EQ 1>
        <TR>
     </CFIF>
     <CFOUTPUT><td><a href=&quot;worldAAp.cfm?pic=#id#&which=#country#&quot;><img src=&quot;images/small/#picSmall#&quot; border=&quot;0&quot;></a><br>
<span class=&quot;text&quot;> #descriptionShort#</span></td>
     </CFOUTPUT>
     <CFSET cellnum = cellnum + 1>
  </cfif>
</CFLOOP>

<CFIF (detailled.RecordCount MOD cellmax) GT 0>
  <CFLOOP index=&quot;orphancells&quot; from=&quot;#cellnum#&quot; to=&quot;#cellmax#&quot;>
     <td> </td>
  </CFLOOP>
  </TR>
</CFIF>

</table>

Oh... and there are no &quot;dorks&quot;, here... just fresh eyes [wink]
Hope it helps,
-Carl
 
hi carl,

wow. tnx a lot, what you wrote will certainly help me out somewhen (luckly there's a my thread history), but i guess you misunderstood me.

the thing with the redcross is different. it's not that it wants to display a file that does not exist. when i right click on the x-image the src parameter is not completed. but it should have stopped displaying long before anyway, because there are no more db entries. hm. it's difficult to describe. ok, example. i have 2 db entries on a picture and display with the code above. it does it correct, but then seems do continue displaying, but without any db info. and by &quot;not in rows&quot; i mean, that after displaying all db-entries correct, it stops displaying them 4 in a row, but just puts one in a row and then starts a new row.

it shouldn't be the the cfoutput, because i used the same output before, just going down and then it worked fine. it must have something to do with the loop. but like i said, it seems just to happen on my computer. on the webserver it works fine. well, maybe you want to check:


go to any continent in The World section.

tnx a lot for you trouble.
adrian
 

Hmmmmmm... you're right, I did misunderstand.

The reason the loop continues without any data might be easy to understand. If you look at the code...

I have 10 entries in the db.

At some point, diggy's loop will realize as
Code:
   :
<cfloop query=&quot;detailled&quot; startrow=&quot;9&quot; endrow=&quot;12&quot;>
   :

I only have 10 rows... yet the loop is asking for rows 9 to 12. It's not hard to figure that some databases might have a problem with that... others might not. I don't know.

Maybe add some code like...

Code:
<cfset min=1>
<cfset max=4>
<table width=&quot;650&quot;>
<cfoutput query=&quot;detailled&quot;>
   <tr>
   <cfloop query=&quot;detailled&quot; startrow=&quot;#min#&quot; endrow=&quot;#max#&quot;>
      <td><a href=&quot;worldAAp.cfm?pic=#id#&which=#country#&quot;><img src=&quot;images/small/#picSmall#&quot; border=&quot;0&quot;></a><br>
      <span class=&quot;text&quot;> #descriptionShort#</span></td>
   </cfloop>
   </tr>
   <cfset min = min + 4>
Code:
   <cfif max GT detailled.RecordCount>
      <cfset max = detailled.RecordCount>
   </cfif>
Code:
</cfoutput>
</table>

I'm also not thrilled with the CFOUTPUT and CFLOOP essentially looping over the same query. That could definitely cause &quot;run-on&quot; (though you'd expect to see it on both systems).

Think about it. A CFOUTPUT with a query parameter is a loop, which walks each row of the resultset. With 10 rows in the database, here's how the loops would resolve-

OUTER LOOP: 1st row
INNER LOOP: 1st row, 2nd row, 3rd row, 4th row
OUTER LOOP: 2nd row
INNER LOOP: 5th row, 6th row, 7th row, 8th row
OUTER LOOP: 3rd row
INNER LOOP: 9th row, 10th row... ooops - max rows
OUTER LOOP: 4th row
INNER LOOP: ... oops
OUTER LOOP: 5th row
INNER LOOP: ... oops
OUTER LOOP: 6th row
INNER LOOP: ... oops
:
OUTER LOOP: 10th row
INNER LOOP: ... opps

In the case above, this would exhibit itself as the thumbnails being output as one per row, too, once the inner loop has hit max rows (since the <td>'s are inside the inner loop, which has ended)... which is something you seem to be describing. So that might be a part of your problem, after all.

One solution that might solve both of these problems (and tidy up the code a bit) is something like:

Code:
<table width=&quot;650&quot; border=&quot;1&quot;>
<cfloop index=&quot;whichrow&quot; from=&quot;1&quot; to=&quot;#detailled.RecordCount#&quot; step=&quot;4&quot;>
   <tr>
   <cfoutput query=&quot;detailled&quot; startrow=&quot;#whichrow#&quot; maxrows=&quot;4&quot;>
      <td><a href=&quot;worldAAp.cfm?pic=#id#&which=#country#&quot;><img src=&quot;images/small/#picSmall#&quot; border=&quot;0&quot;></a><br>
      <span class=&quot;text&quot;> #descriptionShort#</span></td>
   </cfoutput>
   </tr>
</cfloop>
</table>

Benefits:
* no need for min or max variables
* outer loop uses &quot;step&quot;, which could speed things up. It also eliminates the &quot;query&quot; parameter... so there can be no mix up as far as redundant looping
* inner loop (CFOUTPUT) uses &quot;maxrows&quot;, which will never try to pull non-existant data... if the loop has reached the end of record of your data, it's automatically hit it's maxrow. In essence, it's doing the
Code:
<cfif max GT detailled.RecordCount>
check internally. And it's not the same loop as the outter loop.
Hope it helps,
-Carl
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top