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!

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

Three random images 1

Status
Not open for further replies.
GUJUm0deL

GUJUm0deL

Programmer
Jan 16, 2001
3,676
US
Hi all. I'm having some difficulties when trying to get three random images to appear on the site. 4-out-of-5 refreshes the image appear fine, but on the 5-attempt the image (and the image path) are blank.

All images are in the dB and on the server, already checked that.

This is my code:
Code: 
<cfquery name="getFtdLst" datasource="#DB#" username="#DB_Username#" password="#DB_Password#">
	SELECT	L.listingname as LNID, L.User_ID, L.tbnl, U.Username
	FROM	Listing L INNER JOIN Users U ON L.User_ID = U.User_ID
</cfquery> 

<cfif getFtdLst.RecordCount EQ 0> 
	<!--- NOTHING --->
<cfelse> 								
	<cfoutput query="getFtdLst" maxrows="1">
		<cfset QuoteList = ValueList(getFtdLst.LNID)> 
		<cfset RandomQuoteID1 = ListGetAt(QuoteList, RandRange(1, ListLen(QuoteList)))> 
		<cfset RandomQuoteID2 = ListGetAt(QuoteList, RandRange(1, ListLen(QuoteList)))>
		<cfset RandomQuoteID3 = ListGetAt(QuoteList, RandRange(1, ListLen(QuoteList)))>
		
		<cfset featured_prop1 = "user_img/#Username[RandomQuoteID1]#/tbnl/#tbnl[RandomQuoteID1]#">
		<cfset featured_prop2 = "user_img/#Username[RandomQuoteID2]#/tbnl/#tbnl[RandomQuoteID2]#">
		<cfset featured_prop3 = "user_img/#Username[RandomQuoteID3]#/tbnl/#tbnl[RandomQuoteID3]#">
		
		<div style="padding:100px 30px 0px 25px; position: absolute;">					
			<div style="border:1px solid black; height:155px; width: 440px;">
				<div style="float:left; padding:10px 10px 10px 10px;">
				<img src="#featured_prop1#" alt="#featured_prop1#" border="0">
				<br/><a class="featuredProp" href="">Room with a view</a> <br/>NYC, NYC <br/>
				</div>

				<div style="padding:10px 10px 10px 10px;">
				<img src="#featured_prop2#" alt="#featured_prop2#" border="0">
				<br/><a class="featuredProp" href="">Room with a view</a> <br/>NYC, NYC <br/>
				</div>

				<div style="padding:10px 10px 10px 300px; margin:-12.5em -10em 0em 0em;">
				<img src="#featured_prop3#" alt="#featured_prop3#" border="0">
				<br/><a class="featuredProp" href="">Room with a view</a> <br/>NYC, NYC <br/>
				</div>
			</div>
			<h4 style="margin:0em 0em 0em 0em; text-align:right">Featured Listings</h4>
		</div>
	</cfoutput>
</cfif>

This is where you can preview the code:
Hit refresh about 8-10 times and you'll see the broken images/missing path.

____________________________________
Just Imagine.
 
Sort by date Sort by votes
GUJUm0del,

It looks like #Username[RandomQuoteID1]# and #tbnl[RandomQuoteID1]# are returning an empty string. What are #Username# and #tbnl#? Did you cfdump their values to see what's going on?

As an aside, is there a reason you cannot use a simple query to pull the 3 random images?

 
Upvote 0 Downvote
cfStarlight, thanks for helping.

That's what I'm trying to figure out why it's returning an empty string. The info *is* in the dB and the query *does* return everything correctly. I did a cfdump of the query when I was debugging the issue and nothing was NULL.

If you have an easier method of displaying three random images, I'm open to suggestions.

I did a google search for this and got back some tuts (mostly on easycfm.com) but they show how to return one image. I need to query the dB to return back a resultset that provides the user name, listing id, image name, image directory and so forth.

Thanks.

____________________________________
Just Imagine.
 
Upvote 0 Downvote
No problem.

Are #UserName[..]# and #tbnl[..]# columns from the query? At first I thought they might be structures because I usually use the queryname.columnName[row] syntax :)

It you're using sql server you can use the newid() function

Code: 
SELECT TOP 3 (the column names)
FROM    (the tables)
ORDER BY NewID()
 
Upvote 0 Downvote
I just realized what the problem is. The code pulls a random LNID number but these statements require a row number

Code: 
#Username[rowNumber]# .. #tbnl[rowNumber]#

If the LNID numbers don't start at 1 or are not contigous, the RandomQuoteID values might not be valid row numbers. I ran a test and here is the output. Notice how the RandomQuoteID3=31, when the total number of rows in my query is only 27.

Code: 
recordCount=27 
ListLen=27 
QuoteList=2.00,3.00,4.00,5.00,6.00,7.00,8.00,10.00,
11.00,12.00,13.00,15.00,16.00,18.00,19.00,20.00,21.00,
22.00,23.00,24.00,25.00,26.00,27.00,28.00,29.00,30.00,31.00 
RandomQuoteID1=8.00
RandomQuoteID2=4.00
RandomQuoteID3=31.00

Try the code below instead. You also need some logic to make sure the 3 row numbers are not the same.

Code: 
<cfset RandomQuoteID1 = RandRange(1, ListLen(QuoteList))>
..
 
Upvote 0 Downvote
Oops. I pasted the wrong code above. The corrected code is

Code: 
<cfset RandomQuoteID1 = RandRange(1, getFtdLst.RecordCount)>
..
 
Upvote 0 Downvote
cfStarlight, that seemed to do it. I added your code-line and refreshed about 8 times, and all times I got an image.

Check it out here:
Now all I need do so come up with a logic check to make sure all three random images are unique.

____________________________________
Just Imagine.
 
Upvote 0 Downvote
Good. Something like this might work.

Code: 
	<!--- warning: must be at least 3 rows to avoid infinite loop --->
  	<cfif getFtdLst.recordCount gte 3>
		<cfset randomRows = "">
		<cfloop condition="ListLen(randomRows) lt 3">
    	    <cfset row = RandRange(1, getFtdLst.RecordCount)>
			<cfif listFind(randomRows, row) eq 0>
				<cfset randomRows = listAppend(randomRows, row)>
			</cfif>
		</cfloop>
		
	    <cfset row1 = ListGetAt(randomRows, 1)>
	    <cfset row2 = ListGetAt(randomRows, 2)>
	    <cfset row3 = ListGetAt(randomRows, 3)>
		
        <cfset featured_prop1 = "user_img/#getFtdLst.Username[row1]#/tbnl/#getFtdLst.tbnl[row1]#">
        <cfset featured_prop2 = "user_img/#getFtdLst.Username[row2]#/tbnl/#getFtdLst.tbnl[row2]#">
        <cfset featured_prop3 = "user_img/#getFtdLst.Username[row3]#/tbnl/#getFtdLst.tbnl[row3]#">

        <cfoutput>

        <div style="padding:100px 30px 0px 25px; position: absolute;">                    
            <div style="border:1px solid black; height:155px; width: 440px;">
                <div style="float:left; padding:10px 10px 10px 10px;">
                <img src="#featured_prop1#" alt="#featured_prop1#" border="0">
                <br/><a class="featuredProp" href="">Room with a view</a> <br/>NYC, NYC <br/>
                </div>

                <div style="padding:10px 10px 10px 10px;">
                <img src="#featured_prop2#" alt="#featured_prop2#" border="0">
                <br/><a class="featuredProp" href="">Room with a view</a> <br/>NYC, NYC <br/>
                </div>

                <div style="padding:10px 10px 10px 300px; margin:-12.5em -10em 0em 0em;">
                <img src="#featured_prop3#" alt="#featured_prop3#" border="0">
                <br/><a class="featuredProp" href="">Room with a view</a> <br/>NYC, NYC <br/>
                </div>
            </div>
            <h4 style="margin:0em 0em 0em 0em; text-align:right">Featured Listings</h4>
        </div>
    	</cfoutput>
	</cfif>

Btw, does your database support some sort of random row ordering? If it does you might try doing this in sql. Then you won't have to select every row in the entire table just to get 3 random records. You can find examples for a few different databases here

 
Upvote 0 Downvote
Works like a charm! Thanks!

Have a star, :)

BTW, I never knew I could use MS SQL Server to get random records. Nice concept.

But the example I see from the link shows how to get a random id from one table. Does this mean to do what I need, I first need to get the random IDs then do a QofQ to get all the associated columns for those ids?


____________________________________
Just Imagine.
 
Upvote 0 Downvote
BTW, I never knew I could use MS SQL Server to get random records. Nice concept.
Click to expand...

Yes. NewID() works for most cases unless you have a very strict definition of "random".

But the example I see from the link shows how to get a random id from one table. Does this mean to do what I need, I first need to get the random IDs then do a QofQ to get all the associated columns for those ids?
Click to expand...

No. It shouldn't matter. Just add SELECT TOP 3 ... and ORDER BY NewID() to your original query. Now you've got your 3 random rows without all the extra RandRange(..) code.
 
Upvote 0 Downvote
Hey, OK, so I tried the NewID() method, and it works...but I am having some issues with assigning the vars to the <img> path.

Take a look at
This is what i've done:
1) I added the SELECT TOP 3 ... and ORDER BY NewID() to my original query
2) Then I did:
Code: 
					<cfoutput>
					
					<cfloop query="getFtdLst">
						<p>
						<cfset featured_prop[#getFtdLst.currentRow#] = "user_img/#Username[getFtdLst.currentRow]#/tbnl/#tbnl_file1[getFtdLst.currentRow]#">
						
						featured_prop[#getFtdLst.currentRow#] = #featured_prop[getFtdLst.currentRow]# <br/>
						</p>
					</cfloop>
					
					<p>&nbsp;</p>		
					<div style="border:1px solid black; height:155px; width: 440px;">
						<div style="float:left; padding:10px 10px 10px 10px;">
						<img src="#featured_prop[getFtdLst.currentRow]#" alt="#featured_prop[getFtdLst.currentRow]#" border="0">
						<br/><a class="featuredProp" href="">#left(getFtdLst.PropertyTitle[getFtdLst.currentRow],25)#</a> <br/>
						<div class="featuredPropLoc">#getFtdLst.myCity[getFtdLst.currentRow]#</div>
						</div>
	
						<div style="padding:10px 10px 10px 10px;">
						<img src="#featured_prop[getFtdLst.currentRow]#" alt="#featured_prop[getFtdLst.currentRow]#" border="0">
						<br/><a class="featuredProp" href="">#left(getFtdLst.PropertyTitle[getFtdLst.currentRow],25)#</a> <br/>
						<div class="featuredPropLoc">#getFtdLst.myCity[getFtdLst.currentRow]#</div>
						</div>
	
						<div style="padding:10px 10px 10px 300px; margin:-12.5em -10em 0em 0em;">
						<img src="#featured_prop[getFtdLst.currentRow]#" alt="#featured_prop[getFtdLst.currentRow]#" border="0">
						<br/><a class="featuredProp" href="">#left(getFtdLst.PropertyTitle[getFtdLst.currentRow],25)#</a> <br/>
						<div class="featuredPropLoc">#getFtdLst.myCity[getFtdLst.currentRow]#</div>
						</div>
					</div>
					</cfoutput>

____________________________________
Just Imagine.
 
Upvote 0 Downvote
<div style="float:left; padding:10px 10px 10px 10px;">
<img src="#featured_prop[getFtdLst.currentRow]#" alt="#featured_prop[getFtdLst.currentRow]#" border="0">
<br/><a class="featuredProp" href="">#left(getFtdLst.PropertyTitle[getFtdLst.currentRow],25)#</a> <br/>
<div class="featuredPropLoc">#getFtdLst.myCity[getFtdLst.currentRow]#</div>
</div>
Click to expand...

"CurrentRow" isn't changing because the DIV code isn't nested inside a cfloop or cfoutput. That's why its outputting the first row 3 times.
 
Upvote 0 Downvote
Just a thought. But you could simplify the code if you used a class for the DIV styles

Code: 
<style>
.featuredBox1 {float:left; padding:10px 10px 10px 10px;}
.featuredBox2 {padding:10px 10px 10px 10px;}
.featuredBox3 {padding:10px 10px 10px 300px; margin:-12.5em -10em 0em 0em;}
</style>
<cfif getFtdLst.recordCount eq 3>
    <div style="border:1px solid black; height:155px; width: 440px;">
		<cfoutput query="getFtdLst">
    	<div class="featuredBox#CurrentRow#">
        	<img src="user_img/#Username#/tbnl/#tbnl_file1#" alt="user_img/#Username#/tbnl/#tbnl_file1#" border="0">
	        <br/><a class="featuredProp" href="">#left(PropertyTitle,25)#</a> <br/>
    	    <div class="featuredPropLoc">#MyCity#</div>
        </div>
		</cfoutput>
	</div>
</cfif>
 
Upvote 0 Downvote
The <div>'s are nested within the <cfoutput> tags, but not <cfloop>. I did nest it within <cfloop> at first but that caused three boxes to appear.

Take a look at now. I moved the <div>'s inside the <cfloop> as well.

PS - I'm still in developing the site, so for the time being I am using inline CSS styles (until I get the positiong just right).

____________________________________
Just Imagine.
 
Upvote 0 Downvote
I did nest it within <cfloop> at first but that caused three boxes to appear.
Click to expand...

You just have to structure the loop a little differently (See my previous example). I know you haven't finished the CSS. But try the example. It should produce the output you want.
 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

patriciawelch
  • Locked
  • Question
Dreamweaver page with many images loading slow in Internet Explorer
Replies
4
Views
126
darryncooke
darryncooke
urc22
  • Locked
  • Question
Red X shows on newly uploaded images
Replies
4
Views
95
urc22
urc22
WotNow
  • Locked
  • Question
I would like to be able to line up 4 images in a row along with their 1
Replies
1
Views
98
vacunita
vacunita
lucidtech
  • Locked
  • Question
cache only images?
Replies
2
Views
88
SidianConsulting
SidianConsulting
clarky1970
  • Locked
  • Question
Hi I need help on how to center images from hotspot and linked jpeg
Replies
2
Views
70
aich69
aich69

Part and Inventory Search

Sponsor

Back
Top