Facebook
Twitter
RSSמדריך לבניית גלריית תמונות
בשיעור זה נלמד כיצד להכין גלריית תמונות שלמה.
נתחיל בכך שכמובן ניצור לנו מסד נתונים חדש, נפתח את התוכנה Access נלחץ על הלחצן "חדש" נבחר תצוגת עיצוב ונתחיל להקליד לפנים את הנתונים הבאים.
| שם שדה | סוג נתונים |
| ID | מספור אוטומטי |
| description | תזכיר |
| name | תזכיר |
| Image | תזכיר |
התוצאה צריכה להראות כך:
קראתי לטבלה Gallery מן הסתם והגדרתי את השדה ID כמפתח ראשי למרות שזה לא חובה.
כעת ניצור את הדף שיציג לנו את הגלרייה, ניצור דף חדש בשם Gallery.asp ונתחיל להקליד בו:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15 <%
dim conn
set conn=server.createobject("adodb.connection")
dim ConnString
ConnString = "Provider=Microsoft.Jet.OLEDB.4.0; Data Source=" &_
Server.MapPath("Gallery.mdb") & ";"
conn.Open connString
dim rs,sql
set rs=server.CreateObject("adodb.recordset")
sql="select * from gallery "
rs.Open sql,conn
%>
בשורות אלו יצרנו את הקישור למסד הנתונים שלנו (Gallery) ולטבלה שלנו בתוכו גם Gallery נמשיך להקליד1
2
3
4
5 <%
if rs.EOF =true and rs.BOF=true then
Response.write "<center>אין תמונות "
end if
%>
כאן אמרנו לו שאם הרשימה שלנו בתוך הטבלה ריקה אז שירשום שאין תתמונות בגלרייה
נמשיך להקליד:
1
2
3
4
5
6
7
8
9
10
11
12
13 <%
do while not rs.eof
response.Write "<table width=100% dir=rtl border=1>"
response.Write "<td align=right valign=top width=40>"
response.Write "<a href="&"image_details.asp?id=" & rs("id") &">"
response.Write " <img src="/data/uploadedFiles/Articles/images/` "& rs("image") &" ` width=40 height=40>"
response.Write "</td>"
response.Write "<td align=right valign=top>"
response.Write " <font size=2 face=arial> "& rs("description") &"</font> "
response.Write "</td>"
response.Write "</table>"
response.Write "<br>"
מה שיצרנו כאן זה טבלה שתראה את התמונה בקטן (40 על 40) ולידה תיאור, כאשר ילחצו על התמונה זה יוביל אותנו לדף שיראה את התמונה בגודל מלא ושם נכניס את השם שלה גם
נמשיך לקליד:
1
2
3
4
5
6
7
8 rs.movenext
loop
rs.Close
set rs=nothing
conn.Close
set conn=nothing
סגרנו את החיבור ונתנו פקודה להמשיך להזרים את הנתונים בטבלה
כעת בואו נראה את התוצאות
כמובן שאין תמונות כי עדיין לא הכנסו כאלו, בואו נכניס עכשיו קצת נתונים לטבלה
הכנסתי כמה נתנוים והנה התוצאה, כמובן שאצלכם זה יראה שונה.
הינה אנחנו רואים את התמונה בקטן כאמור, ואת התיאור לידה, התמונה גם נהפכה לקישור, בואו נראה לאיזה דף היא מובילה אותנו:
אתם זוכרים שנתנו קישור לדף הזה? כמובן שלא כי לא נתנו,רשמנו לו לזהות את ה ID של התמונה ולפי זה להביא לנו את הקישור המתאים.
כעת נכין את הדף שיציג את התמנה בגודלה הטבעי ויראה את שמה, ניצור דף חדש בשם Image_details.asp ונתחיל להקליד.
1
2
3 <%
dim id
id=Request.QueryString("id")
תחילה הגדרנו את השדה ID כדי שנוכל להשתמש בה בהמשך.
נמשיך:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15 dim conn
set conn=server.createobject("adodb.connection")
dim ConnString
ConnString = "Provider=Microsoft.Jet.OLEDB.4.0; Data Source=" &_
Server.MapPath("Gallery.mdb") & ";"
conn.Open connString
dim rs,sql
set rs=server.CreateObject("adodb.recordset")
sql="select * from gallery where id=" & id
rs.Open sql,conn
יצרנו את החיבור למסד הנתונים ואמרנו לו לקחת את הנתונים מהשדה שהID שווה לתמונה שעליה לחצנו.
נמשיך:1
2
3
4
5
6
7
8
9
10
11
12
13
14 <%
If not rs.eof Then
response.Write "<Center>"
response.Write "<h1> "& rs("name") &" </h1>"
response.Write "<p>"
response.Write "<img src="/data/uploadedFiles/Articles/images/` "& rs("image") &" `> "
response.Write "</center>"
End If
rs.Close
set rs=nothing
conn.Close
set conn=nothing
%>
כעת נלחץ על התמונה שלנו וזוהי התוצאה:
בכוונה הראתי את החלק של שורת הכתובת, תראו עוד הפעם את הכתובת של הדף, הוא משתנה לפי ה ID של התמונה
כאן נגמר המדריך, מקווה שנהנתם.
תגובות בפייסבוק