תחי ישראל - אין לנו ארץ אחרת

תחי ישראל -אין לנו ארץ אחרת

טבלה דינמית באמצעות PHP

מחבר:
בתאריך:

 

מדריך זה מסביר כיצד ליצור טבלה מבוססת PHP ו-HTML שמספר השורות והתאים בה מתעדכן באופן אוטומטי לפי מספר הפריטים. זאת אומרת, שמספר השורות יהיה שונה בטבלה בין מצב שבו יוצגו 24 פריטים לעומת מצב שהטבלה תציג רק 9 פריטים. לצורך הדוגמה, אני מראה טבלה שמציגה תמונות, אבל כמובן שניתן להציג פריט מכל סוג באמצעות אותה לוגיקה.

כדי לראות את הקוד בפעולה, אפשר ללחוץ על הקישור הבא:

להדגמה

 

שלב 1: יצירת קובץ שיכיל את הסקריפט ותיקייה עם תמונות

ניצור את הקובץ index.php, ונכניס לתיקייה ששמה gallery, שבתוכה ניצור גם תיקיית images. לתוך התיקייה נכניס את התמונות הרצויות לנו.

בקובץ index.php, ניצור מבנה של דף HTML.

<html>
<head>
</head>
<body>
</body>
</html>

 

שלב 2: בין תגיות ה-head נזין את המערך עם המידע שלנו

<head>
<?php
         //מערך שמכיל את התמונות
$gallery_items = Array('images/image1.jpg',
'images/image2.jpg', 'images/image3.jpg',
'images/image4.jpg', 'images/image5.jpg',
'images/image6.jpg', 'images/image7.jpg',
'images/image8.jpg', 'images/image9.jpg');
//ספירת מספר הפריטים במערך
$number_items = count($gallery_items);
?>
</head>

שימו לב שספירת הפריטים במערך נעשית באמצעות הפונקציה המובנה של PHP, ששמה count.

 

שלב 3: קביעת מספר הפריטים שיוצגו בכל שורה, וחישוב מספר השורות

<?php
//אנחנו קובעים שמספר הפריטים בשורה של הטבלה יהיה ארבע
$number_items_per_row = 4;
//חישוב מספר השורות
$number_of_rows = ceil($number_items / $number_items_per_row);
?>

הפונקציה ceil מעגלת את התוצאה כלפי מעלה, מפני שכל תוצאה עם שארית משמעותה צורך בשורה נוספת בטבלה.

 

שלב 4: יצירת הטבלה

הטבלה מוגדרת בין תגיות <table>, השורות מיוצרות על ידי לולאה שרצה לפי מספר השורות שחשבנו בסעיף הקודם. 

<table>
<?php
//מייצרים את מספר השורות הרצוי לנו בטבלה
for($k=0; $k < $number_of_rows; $k++){
?>
<tr>

בכל שורה של הטבלה, נייצר מספר של תאים בהתאם למספר שהגדרנו בסעיף 3. גם את התאים בכל שורה בטבלה אנחנו מייצרים בעזרת לופ.

<?php
//מייצרים את מספר הפריטים הרצוי לנו בכל שורה של הטבלה
for($i=0; $i < $number_items_per_row; $i++){
?>
<td>

הפריטים שיוצגו נשלפים מתוך המערך לפי החישוב המתמטי המצורף. החישוב קצת משתנה בין השורה הראשונה לבין השורות הבאות אחריה, כש-m$ מציין את מספר הפריט שיוצג.

<?php
//התנהגות שונה לשורה הראשונה לעומת השורות הבאות בתור
//בשורה הראשונה
if($k==0){
  $m = $i;
}
//משורה 2 והילך החישוב שונה
elseif($k>0){
  $m = ($k*$number_items_per_row) + $i;
}
//נציג רק פריטים קיימים
if($m < $number_items){
  //$m הקוד שמציג תמונה, שמספרה במערך מוגדר על ידי
echo '<img height="100" width="100" src='.' " '.$gallery_items[$m].' " ' />';
}
?>
</td>
<?php } ?>
</tr>
<?php } ?>
</table>

הסקריפט המלא:

<html>
<head>
<?php
//מערך שמכיל את התמונות
$gallery_items = Array('images/image1.jpg',
'images/image2.jpg', 'images/image3.jpg',
'images/image4.jpg', 'images/image5.jpg',
'images/image6.jpg','images/image7.jpg',
'images/image8.jpg', 'images/image9.jpg');
//ספירה של מספר הפריטים במערך
$number_items = count($gallery_items);
?>
</head>
<body>
<?php
//אנחנו קובעים שמספר הפריטים בשורה של הטבלה יהיה ארבע
$number_items_per_row = 4;
//חישוב מספר השורות
$number_of_rows = ceil($number_items / $number_items_per_row);
?>
<table>
<?php
  //מייצרים את מספר השורות הרצוי לנו בטבלה
  for($k=0; $k < $number_of_rows; $k++){
?>
<tr>
<?php
  //מייצרים את מספר השורות הרצוי לנו בכל שורה של הטבלה
  for($i=0; $i < $number_items_per_row; $i++){
?>
<td>
<?php
//התנהגות שונה לשורה הראשונה לעומת השורות הבאות בתור
//בשורה הראשונה
if($k==0){
  $m = $i;
}
//משורה 2 והילך החישוב שונה
elseif($k>0){
  $m = ($k*$number_items_per_row) + $i;
}
//נציג רק פריטים קיימים
if($m < $number_items){
  echo '<img src='.'"'.$gallery_items[$m].'"'.'width="100" height="100" />';
}
?>
</td>
<?php } ?>
</tr>
<?php } ?>
</table>
</body>
</html>

כל מדריכי ה-PHP

 

 

אהבתם? לא אהבתם? דרגו!

0 הצבעות, ממוצע 0 מתוך 5 כוכבים

 

 

המדריכים באתר עוסקים בנושאי תכנות ופיתוח אישי. הקוד שמוצג משמש להדגמה ולצרכי לימוד. התוכן והקוד המוצגים באתר נבדקו בקפידה ונמצאו תקינים. אבל ייתכן ששימוש במערכות שונות, דוגמת דפדפן או מערכת הפעלה שונה ולאור השינויים הטכנולוגיים התכופים בעולם שבו אנו חיים יגרום לתוצאות שונות מהמצופה. בכל מקרה, אין בעל האתר נושא באחריות לכל שיבוש או שימוש לא אחראי בתכנים הלימודיים באתר.

למרות האמור לעיל, ומתוך רצון טוב, אם נתקלת בקשיים ביישום הקוד באתר מפאת מה שנראה לך כשגיאה או כחוסר עקביות נא להשאיר תגובה עם פירוט הבעיה באזור התגובות בתחתית המדריכים. זה יכול לעזור למשתמשים אחרים שנתקלו באותה בעיה ואם אני רואה שהבעיה עקרונית אני עשוי לערוך התאמה במדריך או להסיר אותו כדי להימנע מהטעיית הציבור.

שימו לב! הסקריפטים במדריכים מיועדים למטרות לימוד בלבד. כשאתם עובדים על הפרויקטים שלכם אתם צריכים להשתמש בספריות וסביבות פיתוח מוכחות, מהירות ובטוחות.

המשתמש באתר צריך להיות מודע לכך שאם וכאשר הוא מפתח קוד בשביל פרויקט הוא חייב לשים לב ולהשתמש בסביבת הפיתוח המתאימה ביותר, הבטוחה ביותר, היעילה ביותר וכמובן שהוא צריך לבדוק את הקוד בהיבטים של יעילות ואבטחה. מי אמר שלהיות מפתח זו עבודה קלה ?

השימוש שלך באתר מהווה ראייה להסכמתך עם הכללים והתקנות שנוסחו בהסכם תנאי השימוש.

הוסף תגובה חדשה

 

 

ענה על השאלה הפשוטה הבאה כתנאי להוספת תגובה:

איך אומרים בעברית אינטרנט?

 

תמונת המגיב

שגיב בתאריך: 06.02.2015

מדריך מעולה, תודה, לא הבנתי כל כך את ערכו של הm.

תמונת המגיב

יוסי בן הרוש בתאריך: 06.02.2015

m הוא מספר הפריט. לדוגמה, אם יש לך 3 תמונות, ערך m של התמונה הראשונה הוא 1, של התמונה השנייה 2 של השלישית 3, וכיוצא בזה.