יצירת Partial View
_Person.cshtml, שמסומן כ-Partial View ומוגדר כ-strongly typed למודל Person.Html.Partial, ומעבירים לו את האדם הנוכחי מהלולאה._Header.cshtml. בנתיב מציינים את המיקום המלא, למשל ~/Views/Partials/_Header.cshtml.PartialView עם רשימת תפריט. השם של הפרשל חייב להיות זהה לשם האקשן. בדף הראשי קוראים לו עם Html.Action.להורדת קוד מקור של כל הדוגמאות בקורס MVC – לחץ כאן
פרקי ההרצאה: יצירת Partial View
תמלול ההרצאה: יצירת Partial View
הטקסט המלא של הדקות הראשונות בהרצאה «יצירת Partial View» בקורס הווידאו של PracticU – כתוביות בעברית עם זמן התחלה לכל פסקה. כך תוכלו לקרוא ולחפש את הנושאים לפני שמתחילים ללמוד.
אנחנו מגיעים לנושא שנקרא partial view. partial view זה חלק מ-view שאנחנו רוצים להציג ב-view שאליו הלקוח גלש או שאותו הלקוח רוצה לקבל.
למה חשוב לדעת את זה? כמו שבאבג'קט אוריינטד אנחנו מחלקים בעצם את המערכת לחלקים שכל חלק זה קלאס ומתארת ישות, כך ב-MVC חשוב לחלק גם את ה-views לחלקים. וחשוב לבצע לפעמים view או חלק מ-view שאחר כך משולב בתוך view אחר, ואנחנו יכולים להשתמש בחלק הקטן הזה במספר Views.
הדבר הזה מקביל ב-sp.net ל-Web User Control שאנחנו יכולים אחר כך לקחת אותו ולשלב אותו בכל מיני דפים אחרים.
אז בואו נראה איך זה מתבצע. דבר ראשון, בואו נוסיף לעצמנו איזשהו מודל. נבחר הפעם ב-Person. נגדיר עבור Person First Name ו-Last Name. עכשיו אנחנו יכולים להוסיף קונטרולר, נקרא לו People, והוא מיועד להציג מספר אנשים.
בפונקציית אינדקס ניגש לדאטאבייס שבהמשך נראה בדיוק איך זה מתבצע ונביא ליסט של אנשים. נאכלס את הליסט במספר אנשים, יש לנו פה first name last name נוסיף עוד שני אנשים ונשלח את הרשימה הזאת ל-view שאנחנו רוצים להציג.
בואו נייצר view וכאן נציג את כל האנשים. אז אנחנו צריכים ללכת ולהגדיר מהו המודל שאנחנו רוצים להתעסק איתו. המודל שאנחנו רוצים להתעסק איתו זה list של person, הוא לא מזהה person מפני שperson זאת מחלקה שנמצאת במרחב שמות הזה.
בואו נעתיק את המרחב השמות, נדביק אותו פה ונראה שכרגע אנחנו מזהים את המחלקה person. במקום לעשות את זה אנחנו יכולים בלי קשר לבצע using כמו ב-c-sharp.
כבר אנחנו לא צריכים בכל מקום שאנחנו רוצים להשתמש בטיפוס person לרשום את מרחב השמות המלא ואז את המחלקה person, אלא פשוט מאוד הגדרנו using ואנחנו יכולים להשתמש עם השם person בכל מקום.
כמובן ב-view הנוכחי. אז מה שאנחנו רוצים לעשות זה פשוט להציג את רשימת האנשים שיש לנו, ואנחנו יכולים לרוץ עליה ב-foreach person p in model זה המידע שקיבלנו, ובדיוק פה אנחנו רוצים להציג בן אדם.
אז מה זאת אומרת להציג בן אדם? להציג בן אדם זה להציג את ה-first name שלו, בוא נניח שיש לנו פה איזשהו br, ירידת שורה, ואת ה-last name.
בוא נניח שכל אחד אנחנו רוצים להציג אותו באיזשהו סטייל מסוים, ניקח פה איזשהי div, ניתן לה קלאס על זה ביב פרסון וניתן עיצוב ב-CSS לקלאס הזאת.
לצורך כך ניגש ונבנה תקייה קונטנט בתוכה נצרף יש לנו כאן את ה-New Item Tile Sheet Site CSS ו-Account Color כללי וקלאס עבור ביב פרסון 150 פיקסלים.
נוסיף את כל מה שראינו בנוגע ל-Layouts תקיית View נבנה תקייה שנקראת Shared בתוך תיקיית Shared נוסיף View, זה יהיה ה-Layout.
נגדיר אותו בצורה כזאתי: Leave a layout or master page or use a layout or master page. Leave empty if it is set in Razor View Start File, את זה אנחנו רוצים לעשות.
ניפטר מכל זה, יש לנו כאן את Dock Type, יותר נכון HTML, Add Body, Render Body. נגדיר את אותו לינק לקובץ ה-CSS, נבחר אותו מהקונטנט ונשאר לנו להגדיר בתיקיית views את ה-view view-start. ב-view-start נגדיר שה-layout נמצא בתיקייה הראשית של האתר views/shared והוא נקרא layout.cs.html
אוקיי הגדרנו את הכל בואו נריץ ונבדוק את זה אז אנחנו גולשים ל-people ואנחנו מקבלים בעצם משהו שהוא קצת מוזר כזה אנחנו רואים את כל המידע ששולב בתוך האזור של ה-view שלנו בואו בואו נבצע טיפה הפרדה בין בן אדם אחד לבן אדם שני ואת זה נבצע על ידי ה-CSS.
נבצע מרג'ין של 20 פיקסלים ובורדר של, יש לנו פה 1PX סוליד לה. נגלוש שוב לאתר, בסדר. קיבלנו כרגע עיצוב אחיד לכל האנשים, אבל בואו נסתכל רגע איפה רשמנו את העיצוב הזה.
רשמנו את העיצוב בתוך ה-View עצמו, מכאן עד לכאן. יכול להיות שבדיוק את העיצוב הזה אנחנו רוצים להשתמש איתו בכל מיני views שונים ולכן במקום לחזור עליו בכל מקום כדאי לנו לקחת אותו ולהוציא אותו למשהו שנקרא partial view, כלומר view חלקי ואז
לקרוא לו מפה כאשר העיצוב ייכתב פעם אחת בתוך ה-partial view. אז איך אנחנו עושים את זה? אנחנו הולכים לתיקייה של כל ה-views של האנשים שלנו, או יותר נכון של ה-controller people יש לו תיקיית views people בתוכה יש לנו רק view1 index.csh.tml ונוסיף אליו view,
partial view נהוג גם כן להתחיל באנדרליין ונקרא לו person.partial עכשיו נסמן create as a partial view. ברגע שאנחנו עושים את הדבר הזה זה אומר שה-view שלנו הוא בעצם חלק מ-view גדול ולכן הוא לא יגדיר בעצמו שום לארט הוא יגדיר רק את המידע שאנחנו רוצים שיהיה בו ספציפית בלי הלאות הכללי של כל האתר.
כמובן שאם אנחנו מתעסקים במודל מסוים כמו במקרה הזה אנחנו מתעסקים פה עם פרסון אחד אז חשוב להגדיר שהוא יהיה סטרונגלי טייט ולהגדיר פה את המחלקה של המודל שלנו שזה בעצם בן אדם אחד ויחיד מסוג partial view.mode.person נוסיף את ה-view הזה אנחנו רואים פה את המודל נחזור בחזרה נעתיק את כל
התצוגה של אדם אחד ויחיד ונדביק אותה כאן בפרשל view. כל מה שאנחנו צריכים עכשיו לעשות זה לקרוא לה מה-view בו אנחנו רוצים להציג אותה וכמובן ב-view שאנחנו רוצים להציג יש לנו פה את המשתנה p כאן אין לנו שום משתנה p ואיך