所以继续我的问题,我从一个数据库拉到我的网站。我的数据库中需要显示的键/属性(列)是PostedDate,DataImage和Source。我希望它们作为一个div输出,顶部的贴片位于中间的图像和底部的源,我必须这样做。但是,我需要它们循环3列并每3列创建一个新行,这样它就会被分开而不只是一个大的列或行。
所以它会像[PostedDate,Image,Source] [PostedDate,Image,Source]等多行的3列
这就是我想让它看起来像:
这是我当前的代码,但是当我刷新网页时,它会给我一个404或500错误:
<!--- set the number of colums you wish to have --->
<cfset cols = 3>
<cfset totalRows = ceiling(UIData.RecordCount / cols)>
<cfset output = 1>
<table width = "100%" border="0" align="center" cellpadding="2" cellspacing= "2">
<cfloop from = "1" to = "#totalRows#" index = "thisRow">
<tr>
<cfloop from = "1" to = "#cols#" index = "thisCol">
<td width = "<cfoutput>#numberformat((100/cols), 99)#</cfoutput>%" align="center" nowrap style = "border: 1px solid #ccc;">
<cfif output != UIData.recordCount>
<cfoutput>
<div> <font style="font-size: .8em; line-height: .6em; padding-bottom: .8em;"><strong> #PostedDate# </strong></font> </div>
<div> <img src="http://www.iowalum.com/uidata/images/#DataImage#" alt="" width="99%" height="264" style="padding-top:10px; padding-bottom:10px;" /> </div>
<div id ="text"> #Source# </div> </cfoutput>
<cfelse>
<!--- use <br> to display an empty cell --->
<br>
</cfif>
<!--- increment counter to the next record in this example if we started on the first cell of the first row it would be 1(a), then 4(d), then 7(g) and so on if this was the firs cell on the second row it would be 2(b), 5(e), 8(h), continue... --->
<cfset output = output + totalRows>
</td>
</cfloop>
<!--- this little bit tells where to start the next row. if we just finished the first row output would be 2(b) --->
<cfset output = thisRow + 1>
</tr>
</cfloop>
答案 0 :(得分:0)
这种方法可能更简单。
<cfset ItemsPerRow = 3>
<tr>
<cfoutput query="your query">
<td>#output something# </td>
<cfif currentrow mod ItemsPerRow is 0>
</tr><tr>
<cfelseif currentrow is recordcount>
</tr>
</cfif>
</cfoutput>
<tr>