2014-04-07 40 views
1

我想教自己冷聚變,javascript和mysql。我創建了一個頁面,用戶可以點擊圖像,然後彈出窗口將顯示完整圖像。我的代碼編譯,但它總是顯示我的圖像數據庫中的第一個圖像。我花了很多時間在這個,但無法弄清楚我錯過了什麼。有人能給我提示如何解決這個問題嗎?在此先感謝您的幫助!我的代碼如何顯示錯誤的圖像?

文件1:full_article_view.cfm

<!--- retrieve the full article as well as its images ---> 
<CFQUERY NAME="myQuery1" Datasource="mydb" > 
SELECT articles.article_ID, articles.article_title, articles.article_author, 
     articles.article_date, articles.article_content, article_image_mapping.aim_articleID 
FROM articles 
INNER JOIN article_image_mapping ON articles.article_ID = article_image_mapping.aim_articleID 
WHERE articles.article_ID = #URL.ID# 
GROUP BY article_image_mapping.aim_articleID 
</CFQUERY> 

<CFQUERY NAME="myQuery2" Datasource="mydb" > 
SELECT images.image_ID, images.image_thumbpath, images.image_fullpath, article_image_mapping.aim_articleID, article_image_mapping.aim_imageID 
FROM images 
INNER JOIN article_image_mapping ON images.image_ID = article_image_mapping.aim_imageID 
WHERE article_image_mapping.aim_articleID = #URL.ID# 
</CFQUERY> 


<!DOCTYPE html> 
<html> 
<head> 
    <title>Learning</title> 
    <meta charset="UTF-8"> 
    <script Language="JavaScript"> 
     function popup() 
     { 
      settings="toolbar=yes,location=yes,directories=yes,"+ 
      "status=no,menubar=no,scrollbars=yes,"+ 
      "resizable=yes"; 

      MyNewWindow = window.open("full_img.cfm?toshow=images.image_ID"); 
     } 
    </script> 
</head> 
<body> 
    <!--- Page Title ---> 
    <h3>Full Article View</h3> 

    <!--- Page Content ---> 
    <div align="left"> 
     <!--- Display article title, author, date, and full content ---> 
     <cfoutput query="myQuery1"> 
      <b>#ucase(myquery1.article_title)#</b> 
      <hr> 
      <p style="color:##848181; font-size:12px">#myquery1.article_author# :: #myquery1.article_date#</p> 
      #myquery1.article_content#<br/> 
     </cfoutput> 
     <br> 
     <!--- Display images associated with article---> 
     <cfoutput query= "myQuery2"> 
      <a href="" onClick="popup();"> 
      <img src="#myquery2.image_thumbpath#" alt="image thumbnail"> 
      </a> 
     </cfoutput> 
    </div> 
</body> 
</html> 

文件2:full_img.cfm

<CFQUERY NAME="myQuery3" Datasource="mydb" > 
SELECT image_ID, image_thumbpath, image_fullpath 
FROM images 
WHERE image_ID = #URL.toshow# 
</CFQUERY> 

<cfoutput> 
<img src="#myquery3.image_fullpath#"> 
</cfoutput> 
+2

我不是CF專家,但是,不應該將'cfoutput'顯示爲循環迭代或結果集? http://www.quackit.com/coldfusion/tutorial/coldfusion_lists.cfm http://www.quackit.com/coldfusion/tutorial/coldfusion_query_of_queries.cfm – luchosrock

+1

如有疑問,請查看您的數據。 cfdump標籤使這很簡單。 –

回答

2

在您的popup()函數中,您正在引用images.image_ID。這將會以「images.image_ID」的形式出現,而不會轉換爲id。

您可以更改彈出窗口以傳入您想要的ID。

<script Language="JavaScript"> 
    function popup(id) 
    { 
     settings="toolbar=yes,location=yes,directories=yes,"+ 
     "status=no,menubar=no,scrollbars=yes,"+ 
     "resizable=yes"; 

     MyNewWindow = window.open("full_img.cfm?toshow=" + id); 
    } 
</script> 

然後在你的HTML/CFML代碼

<!--- Display images associated with article---> 
    <cfoutput query= "myQuery2"> 
     <a href="" onClick="popup(#myQuery2.image_ID#);"> 
     <img src="#myquery2.image_thumbpath#" alt="image thumbnail"> 
     </a> 
    </cfoutput> 

我知道你教自己的ColdFusion。我建議您在查詢中使用cfqueryparam標記以防止SQL攻擊。你需要在你的查詢中使用#URL.ID#。

所以這個:

...WHERE articles.article_ID = #URL.ID# 

會是這樣:

...WHERE articles.article_ID = <cfqueryparam value = "#URL.ID#" cfsqltype = "cf_sql_integer"> 

希望幫助一些。

+0

非常感謝您的幫助!在我的程序中進行了修改之後,一切都很順利!無論如何,你介意給我一些關於我可以學習冷聚變的在線資源嗎? =) – user2203774

+1

http://www.learncfinaweek.com/ –

0

據我評論的鏈接,應指定在CFOUTPUT查詢query屬性

<cfoutput query="myQuery3"> 
<img src="#image_fullpath#"> 
</cfoutput>