מדריך CSHTML – שימוש ב- Helpers לחיבור לרשתות חברתיות
בפרק הקודם הוספנו חבילת Helpers לאתר שלנו וכעת נראה איך נוכל להשתמש בה כדי להוסיף חיבור לרשתות חברתיות לאתר שלנו. ע"י שימוש ב- Helpers, המשימה הזאת תהיה קלה מאד.
1. באתר שלך, הוסף קובץ CSHTML חדש בשם TwitterFeed.cshtml.
2. החלף את תוכן דף ה- CSHTML שנוצר בקוד הבא:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Twitter Feed</title>
</head>
<body>
<h1>Twitter Feed</h1>
<form action="" method="POST">
<div>
Enter the name of another Twitter feed to display:
<input type="text" name="TwitterUser" value=""/>
<input type="submit" value="Submit" />
</div>
<div>
@if (Request["TwitterUser"].IsEmpty()) {
@Twitter.Search("microsoft")
}
else {
@Twitter.Profile(Request["TwitterUser"])
}
</div>
</form>
</body>
</html>
קוד ה- HTML הזה יוצר טופס שמציג שדה טקסט בו המשתמש יזין שם משתמש, וכפתור Submit. שני אלה נמצאים בתוך הסט הראשון של תגיות ה- <div>.
בתוך הסט השני של תגיות ה- <div> יש מעט קוד (אפשר לזהות את תחילת הקוד ע"פ הסימן @). הקוד בודק האם יש ערך בשדה הטקסט ששמו TwitterUser. מכיוון שבפעם הראשונה שבדף מוצג המשתמש עדיין לא הזין שם של משתמש, הערך בשדה ריק ולכן יוצג ערוץ הטוויטר של מיקרוסופט. כאשר משתמש יזין שם משתמש בטוויטר וילחץ על כפתור ה- Submit, יוצג ערוץ הטוויטר של המשתמש ששמו הוזן.
3. הרץ את הדף בדפדפן (לחץ על F12). יוצג ערוץ הטוויטר של מיקרוסופט.
4. הכנס שם של משתמש אחר בטוויטר (לדוגמא: eliantebi) ולחץ על הכפתור Submit. כעת יוצג ערוץ הטוויטר של המשתמש שהזנת.
בדוגמה הזאת ראינו איך אפשר לבנות אתר דינאמי שעושה שימוש בחבילות הרבה אחרות, שהופכות משימות מורכבות כמו חיבור לרשתות חברתיות לעניין פשוט במיוחד.
תגובות בפייסבוק