FINAL RECQUIREMENT | C# Online Compiler

FINAL RECQUIREMENT by Jilliane Joy B. Santiago

namespace Santiago.Models
{
    public class Student
    {
        public string First_Name { get; set; }
		public string Middle_Name { get; set; }
        public string Last_Name { get; set; }
		public string Nickname { get; set; }
        public int Age { get; set; }
        public string CourseMajorSection { get; set; }
		public string Gender { get; set; }
		public string Birthdate { get; set; }
		public string Place_of_Birth { get; set; }
		public string Civil_Status { get; set; }
		public string Address { get; set; }
		public string Nationality { get; set; }
		public string Zipcode { get; set; }
		public string Email_Address { get; set; }
		public string Cellphone_No { get; set; }
		public string Height { get; set; }
		public int Weight { get; set; }
		

    }
}

Model

​x
 
namespace Santiago.Models
{
    public class Student
    {
        public string First_Name { get; set; }
        public string Middle_Name { get; set; }
        public string Last_Name { get; set; }
        public string Nickname { get; set; }
        public int Age { get; set; }
        public string CourseMajorSection { get; set; }
        public string Gender { get; set; }
        public string Birthdate { get; set; }
        public string Place_of_Birth { get; set; }
        public string Civil_Status { get; set; }
        public string Address { get; set; }
        public string Nationality { get; set; }
        public string Zipcode { get; set; }
        public string Email_Address { get; set; }
        public string Cellphone_No { get; set; }
        public string Height { get; set; }
        public int Weight { get; set; }
        
​
    }
}

@model IEnumerable<Santiago.Models.Student>

@{
    ViewBag.Title = "Index";
    Layout = null;
}

<html>
	<head>
		<!-- CSS Includes -->
		<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
	</head>


<div>
    <h2>Boracay Escapade with Him (♡‿♡)</h2>
    <p>My Final Recquirement in COMP 221</p>
	<p><a href="https://www.telegram.com/_chmchm/" class="btn btn-primary btn-lg">My Telegram &raquo;</a></p>
	<h2>Favorite Place with My Favorite Person 🌴</h2>
 	<p>Boracay, Philippines</p>
	<img src="https://scontent.fklo1-1.fna.fbcdn.net/v/t39.30808-6/342494883_576438741256678_4819606912554935363_n.jpg?stp=cp6_dst-jpg&_nc_cat=101&ccb=1-7&_nc_sid=0debeb&_nc_eui2=AeFU9hcVMwrKpJnkmWSsqFXIWPIftXgchzRY8h-1eByHNFWn-4fSezN6GJRJmLJ0PpnuuHNodsOMOT_vmH2RvlKq&_nc_ohc=xgw7CbbSdHEAX9GEW6E&_nc_ht=scontent.fklo1-1.fna&oh=00_AfAhx8AWZXIDiiYZVzAoD7P_6hd817yVKDLiVN-rNE3SRw&oe=64492846" width="200" height="250" class="alignone size-large wp-image-27835" style="border:5px solid #000000; padding:3px; margin:5px"></a>
	<img src="https://scontent.fklo1-1.fna.fbcdn.net/v/t39.30808-6/342998035_1414020462688771_2459845497050290752_n.jpg?stp=cp6_dst-jpg&_nc_cat=105&ccb=1-7&_nc_sid=0debeb&_nc_eui2=AeGwUQUcbaQgr8bcBNwqRprYxd1StPiXGCfF3VK0-JcYJ-ePHMa2OFV9Rn1HpMLNopx9Zv84lIOtjixzLAMq8hdI&_nc_ohc=rl92qRv5S2IAX-WeXCX&_nc_ht=scontent.fklo1-1.fna&oh=00_AfDOYgoRZrFlTqumzgR1DYQvUrkGaF7JmPUEdO-UapRw1Q&oe=6448F2AD" width="200" height="250" class="alignone size-large wp-image-27835" style="border:5px solid #000000; padding:3px; margin:5px"></a>
</div>	
		
<div>
	<h2>Puka Beach, Boracay 🌊</h2>
	<p> Malay, Aklan </p>
	<img src="https://scontent.fklo1-1.fna.fbcdn.net/v/t39.30808-6/336916865_1704469403337225_2047223526101125589_n.jpg?_nc_cat=110&ccb=1-7&_nc_sid=0debeb&_nc_eui2=AeF7RAbk_VZg467yp_5FyMBE0LrKAX18UY3QusoBfXxRjcJmj_xu5BZNolqiqtbSAUpG9cxJ2quBjc4uCw2hEJgi&_nc_ohc=9aB-pU3IG3cAX_PhXF3&_nc_ht=scontent.fklo1-1.fna&oh=00_AfBVSk5i1hIqV3iHSR3eCQWkv850tP2_FUs1ankNF13oXw&oe=6449A2E8" width="250" height="150" style="border:5px double black;" #000000; padding:3px>
	<img src="https://scontent.fklo1-1.fna.fbcdn.net/v/t39.30808-6/336902822_903503027557074_8904806546511024539_n.jpg?_nc_cat=105&ccb=1-7&_nc_sid=0debeb&_nc_eui2=AeHa8bXIEW5_x344SROXHM-E034QancDv7XTfhBqdwO_tciBb8RrGozlnPorggcaTu62vBQqxnuPpnUWnqJ1XvWY&_nc_ohc=gbm6LVVEBOMAX9S8Tv2&_nc_ht=scontent.fklo1-1.fna&oh=00_AfDMan2OY5v36s-b003yKkP6-FDt0eTdWxxKbJW2gDwppw&oe=6449603D" width="300" height="150"  style="border:5px double black;" #000000; padding:3px>
</div>
	
<div>
	<h2>Coffee Date ♡ </h2>
 	<p>Starbucks, Boracay</p>
	<img src="https://scontent.fklo1-1.fna.fbcdn.net/v/t39.30808-6/336899301_1376912633101904_2461713850158336723_n.jpg?stp=cp6_dst-jpg&_nc_cat=102&ccb=1-7&_nc_sid=0debeb&_nc_eui2=AeFYIS8ws5uq6dTjhX8V2TIdbbMGbpKUaURtswZukpRpRJHrOrCxomi6O4OHeCIp0UsIMFMuQt8kUv70g-lX2gdA&_nc_ohc=sbWlYfl1VOYAX_m6ekd&_nc_ht=scontent.fklo1-1.fna&oh=00_AfBD0qb-Zw_1ZTO0DeqgHvfmt3N4eZh2KKFn_1JTR49wDw&oe=64489418" width="200" height="250" style="border:5px groove gold;" #000000; padding:3px> 
	<img src="https://scontent.fklo1-1.fna.fbcdn.net/v/t39.30808-6/342887037_183493384524312_5132783108776358599_n.jpg?stp=cp6_dst-jpg&_nc_cat=110&ccb=1-7&_nc_sid=0debeb&_nc_eui2=AeGxeop9ovogoI-_kjj2TP1_-1OxhMMiOnj7U7GEwyI6eK331cHT4Toi0V1Hj8HqvvaABdSH54_guYPJ0_5B3du7&_nc_ohc=CiC1mLI0mtgAX_XSE6o&_nc_ht=scontent.fklo1-1.fna&oh=00_AfCPBf5NVS_zxaANABrSmlSLx2W2FTEqafNTfkxg77Zt7Q&oe=64484CBA" width="200" height="250"  style="border:5px groove gold;" #000000; padding:3px> 
	<img src="https://scontent.fklo1-1.fna.fbcdn.net/v/t39.30808-6/343166885_225683580058565_4193065843334503175_n.jpg?stp=cp6_dst-jpg&_nc_cat=105&ccb=1-7&_nc_sid=0debeb&_nc_eui2=AeEqtP5r4d26HY6mqj8pNRpkUc_S2Zg7xTtRz9LZmDvFO8PtuhsPqi-LjjGAt3AtI8xKGqhc6cOZiPYny6KczS9s&_nc_ohc=jHTouu3QEaEAX-RzKER&_nc_ht=scontent.fklo1-1.fna&oh=00_AfBtpJJFEEwkEtW8v_FOdLhD6v_3KsAU_YEZ4GU2fFFtFw&oe=64497714" width="200" height="250"  style="border:5px groove gold;" #000000; padding:3px> 
</div>
		
<div>
	<h2>Sunset 🌅 </h2>
 	<p>Front Beach, Station 2 Boracay</p>
	<img src="https://scontent.fklo1-1.fna.fbcdn.net/v/t39.30808-6/342511250_599311242170053_8082855659083743729_n.jpg?stp=cp6_dst-jpg&_nc_cat=108&ccb=1-7&_nc_sid=0debeb&_nc_eui2=AeG3WxVWs5dgk9lwgb-nfFOFPLF6oemjxdU8sXqh6aPF1XUln2mX9ijZwExKan6ZDeXQ0fCzxCFYKUVduOHkQ4-W&_nc_ohc=cvqXCCFqvYcAX-I6_BH&_nc_ht=scontent.fklo1-1.fna&oh=00_AfDI6hov2ngpZ8GGSZCD2Y6mygphnlg5Klnys4GuNxKclA&oe=644900FA" width="200" height="150" style="border:10px solid goldenrod;" #000000; padding:3px>
	<img src="https://scontent.fklo1-1.fna.fbcdn.net/v/t39.30808-6/342981821_573089644919696_2017526801674845898_n.jpg?stp=cp6_dst-jpg&_nc_cat=100&ccb=1-7&_nc_sid=0debeb&_nc_eui2=AeH4ULr7DTGOicNNWTRY-sSAHo_A1AILPCAej8DUAgs8IKDUXYXH5qYhn-vvWecLgBCLuCLa1wg5t3z7M-FSVb1e&_nc_ohc=Swsg60JtysIAX8CkAQs&_nc_ht=scontent.fklo1-1.fna&oh=00_AfDq6suXNitJ0MwVGXXRR1hk6nME_dvHV_vXFolEmhunaA&oe=6447F643" width="200" height="150" style="border:10px solid dodgerblue;" #000000; padding:3px>
</div>

<div>
	<h2>Boracay NewCoast 🐚 </h2>
	<p> Yapak, Malay, Aklan </p>
	<img src="https://scontent.fklo1-1.fna.fbcdn.net/v/t39.30808-6/342814403_3566356506931036_3442099173585918417_n.jpg?stp=cp6_dst-jpg&_nc_cat=102&ccb=1-7&_nc_sid=0debeb&_nc_eui2=AeHB5aUjiIKUgjU8wr6XRdGI6daPHGflSNzp1o8cZ-VI3HzSgS-rqgPKyTrq3sWnojp5aoKo0LaeFEPT7lUXV6If&_nc_ohc=iZY8gRNDHBEAX-f9YBf&_nc_ht=scontent.fklo1-1.fna&oh=00_AfA1Yv8KpKR2au8kR39whlWvEld37sLex76BA18X_6QmZw&oe=64480BB1" width="200" height="150" style="border:10px outset silver;" #000000; padding:3px>	
	<img src="https://scontent.fklo1-1.fna.fbcdn.net/v/t39.30808-6/343000926_750048816564089_7035367586017523765_n.jpg?stp=cp6_dst-jpg&_nc_cat=106&ccb=1-7&_nc_sid=0debeb&_nc_eui2=AeHOJmTNSoNYGmYs5mKfAP92l-yFSucFcdKX7IVK5wVx0jAjKBbw2fVvwnVIlzIFZPIZzrA4TiNqgDr0DqYg1o9W&_nc_ohc=7jQXbbTgJH8AX_7HPu7&_nc_ht=scontent.fklo1-1.fna&oh=00_AfAg8xMlnkLs-b797Hvfy2_FYgxMnPC5v3AVzLe2EUZYQw&oe=6447E40B" width="200" height="250" style="border:10px outset silver;" #000000; padding:3px>
</div>

<div>
	<h2>Halo Mango Boracay 🍨 </h2>
	<p>D'Mall, Station 2, Boracay, Philippines </p>
	<img src="https://scontent.fklo1-1.fna.fbcdn.net/v/t39.30808-6/342984149_898907047848741_3842710518235169577_n.jpg?stp=cp6_dst-jpg&_nc_cat=106&ccb=1-7&_nc_sid=0debeb&_nc_eui2=AeG8-HSN78XITYD2Sew0FroEDkqx7URqt9YOSrHtRGq31jZk1smKPQvFED_eEI2zLuOghUqsNamRro8OLgtONaWT&_nc_ohc=almGlTOWSDUAX-QvDIl&_nc_ht=scontent.fklo1-1.fna&oh=00_AfBvMq-Nfj7fXlOn2_tW8msInVoL-1_lxVll7XPO5PA9yw&oe=64485735" width="200" height="250" style="border:5px dashed red;>
</div>

<div>
    <h1>Information About Me</h1>
</div>
	<body>
		<div class="container">
		<h2>My personal information</h2>

		<table class="table">
    		<tr>
        		<th>
          		 	@Html.DisplayNameFor(model => model.First_Name)
       			</th>
				<th>
          		 	@Html.DisplayNameFor(model => model.Middle_Name)
       			</th>
        		<th>
          		 	@Html.DisplayNameFor(model => model.Last_Name)
       			</th>	
				<th>
          		 	@Html.DisplayNameFor(model => model.Nickname)
       			</th>	
        		<th>
          		 	@Html.DisplayNameFor(model => model.Age)
       			</th>	
        		<th>
          		 	@Html.DisplayNameFor(model => model.CourseMajorSection)
       			</th>		
        		<th>
          		 	@Html.DisplayNameFor(model => model.Gender)
       			</th>	
        		<th>
          		 	@Html.DisplayNameFor(model => model.Birthdate)
       			</th>		
        		<th>
          		 	@Html.DisplayNameFor(model => model.Place_of_Birth)
       			</th>	
        		<th>
          		 	@Html.DisplayNameFor(model => model.Civil_Status)
       			</th>
				<th>
          		 	@Html.DisplayNameFor(model => model.Address)
       			</th>
        		<th>
          		 	@Html.ListBox("Nationality", new List<SelectListItem> {
					new SelectListItem { Text="American", Value="1"},
					new SelectListItem { Text="Canadian", Value="2"},
					new SelectListItem { Text="Filipino", Value="3"},
					new SelectListItem { Text="Russian", Value="4"},
					new SelectListItem { Text="Swedish", Value="5"},					
					new SelectListItem { Text="Korean", Value="6"},				   
					new SelectListItem { Text="Japanese", Value="7"},					   
					new SelectListItem { Text="Indian", Value="8"},					
					new SelectListItem { Text="Scottish)", Value="9"},
					new SelectListItem { Text="Others...", Value="10"}
					}, new { @class="form-control" })
       			</th>	
        		<th>
          		 	@Html.DisplayNameFor(model => model.Zipcode)
       			</th>
        		<th>
          		 	@Html.DisplayNameFor(model => model.Email_Address)
       			</th>		
        		<th>
          		 	@Html.DisplayNameFor(model => model.Cellphone_No)
       			</th>	
				<th>
          		 	@Html.DisplayNameFor(model => model.Height)
       			</th>
				<th>
          		 	@Html.DisplayNameFor(model => model.Weight)
       			</th>
   			</tr>

@foreach (var item in Model) {
    	<tr>
        	<td>
            	@Html.DisplayFor(modelItem => item.First_Name)
        	</td>
			<td>
            	@Html.DisplayFor(modelItem => item.Middle_Name)
        	</td>
        	<td>
            	@Html.DisplayFor(modelItem => item.Last_Name)
        	</td>
			<td>
            	@Html.DisplayFor(modelItem => item.Nickname)
        	</td>
        	<td>
            	@Html.DisplayFor(modelItem => item.Age)
        	</td>
        	<td>
            	@Html.DisplayFor(modelItem => item.CourseMajorSection)
        	</td>
			<td>
            	@Html.DisplayFor(modelItem => item.Gender)
				
				@Html.DropDownList("Gender", new List<SelectListItem> {
				new SelectListItem {Text="Select Gender",Value="-1" },
				new SelectListItem {Text="Male",Value="1" },
				new SelectListItem {Text="Female", Value="2" },
				new SelectListItem {Text="Bisexual", Value="3" },
				new SelectListItem {Text="Gay", Value="4" },
				new SelectListItem {Text="Transgender", Value="5" },
				new SelectListItem {Text="Lesbian", Value="6" }
				}, new { @class = "custom-select" })					
        	</td>
        	<td>
            	@Html.DisplayFor(modelItem => item.Birthdate)
        	</td>			
        	<td>
            	@Html.DisplayFor(modelItem => item.Place_of_Birth)
        	</td>			
        	<td>
            	@Html.DisplayFor(modelItem => item.Civil_Status)
				
				@Html.DropDownList("Civil_Status", new List<SelectListItem> {
				new SelectListItem {Text="Select Status",Value="-1" },
				new SelectListItem {Text="Single",Value="1" },
				new SelectListItem {Text="Married", Value="2" },
				new SelectListItem {Text="Widowed", Value="3" },
				new SelectListItem {Text="Single Parent", Value="4" },
				new SelectListItem {Text="Divorced", Value="5" }
				}, new { @class = "custom-select" })
        	</td>
        	<td>
            	@Html.DisplayFor(modelItem => item.Address)
        	</td>
			<td>
          		 	@Html.ListBox("Nationality", new List<SelectListItem> {
					new SelectListItem { Text="American", Value="1"},
					new SelectListItem { Text="Canadian", Value="2"},
					new SelectListItem { Text="Filipino", Value="3"},					
					new SelectListItem { Text="Russian", Value="4"},
					new SelectListItem { Text="Swedish", Value="5"},					
					new SelectListItem { Text="Korean", Value="6"},					   
					new SelectListItem { Text="Japanese", Value="7"},					   
					new SelectListItem { Text="Indian", Value="8"},				
					new SelectListItem { Text="Scottish)", Value="9"},
					new SelectListItem { Text="Others...", Value="10"}
					}, new { @class="form-control" })	
			</td>
        	<td>
            	@Html.DisplayFor(modelItem => item.Zipcode)
        	</td>
        	<td>
            	@Html.DisplayFor(modelItem => item.Email_Address)
        	</td>
        	<td>
            	@Html.DisplayFor(modelItem => item.Cellphone_No)
        	</td>
			<td>
            	@Html.DisplayFor(modelItem => item.Height)
        	</td> 
			<td>
            	@Html.DisplayFor(modelItem => item.Weight)
        	</td> 
    	</tr>
}
		</table>	
</body>
</html>

View

 
@model IEnumerable<Santiago.Models.Student>
​
@{
    ViewBag.Title = "Index";
    Layout = null;
}
​
<html>
    <head>
        <!-- CSS Includes -->
        <link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
    </head>
​
​
<div>
    <h2>Boracay Escapade with Him (♡‿♡)</h2>
    <p>My Final Recquirement in COMP 221</p>
    <p><a href="https://www.telegram.com/_chmchm/" class="btn btn-primary btn-lg">My Telegram &raquo;</a></p>
    <h2>Favorite Place with My Favorite Person 🌴</h2>
    <p>Boracay, Philippines</p>
    <img src="https://scontent.fklo1-1.fna.fbcdn.net/v/t39.30808-6/342494883_576438741256678_4819606912554935363_n.jpg?stp=cp6_dst-jpg&_nc_cat=101&ccb=1-7&_nc_sid=0debeb&_nc_eui2=AeFU9hcVMwrKpJnkmWSsqFXIWPIftXgchzRY8h-1eByHNFWn-4fSezN6GJRJmLJ0PpnuuHNodsOMOT_vmH2RvlKq&_nc_ohc=xgw7CbbSdHEAX9GEW6E&_nc_ht=scontent.fklo1-1.fna&oh=00_AfAhx8AWZXIDiiYZVzAoD7P_6hd817yVKDLiVN-rNE3SRw&oe=64492846" width="200" height="250" class="alignone size-large wp-image-27835" style="border:5px solid #000000; padding:3px; margin:5px"></a>
    <img src="https://scontent.fklo1-1.fna.fbcdn.net/v/t39.30808-6/342998035_1414020462688771_2459845497050290752_n.jpg?stp=cp6_dst-jpg&_nc_cat=105&ccb=1-7&_nc_sid=0debeb&_nc_eui2=AeGwUQUcbaQgr8bcBNwqRprYxd1StPiXGCfF3VK0-JcYJ-ePHMa2OFV9Rn1HpMLNopx9Zv84lIOtjixzLAMq8hdI&_nc_ohc=rl92qRv5S2IAX-WeXCX&_nc_ht=scontent.fklo1-1.fna&oh=00_AfDOYgoRZrFlTqumzgR1DYQvUrkGaF7JmPUEdO-UapRw1Q&oe=6448F2AD" width="200" height="250" class="alignone size-large wp-image-27835" style="border:5px solid #000000; padding:3px; margin:5px"></a>
</div>  
        
<div>
    <h2>Puka Beach, Boracay 🌊</h2>
    <p> Malay, Aklan </p>
    <img src="https://scontent.fklo1-1.fna.fbcdn.net/v/t39.30808-6/336916865_1704469403337225_2047223526101125589_n.jpg?_nc_cat=110&ccb=1-7&_nc_sid=0debeb&_nc_eui2=AeF7RAbk_VZg467yp_5FyMBE0LrKAX18UY3QusoBfXxRjcJmj_xu5BZNolqiqtbSAUpG9cxJ2quBjc4uCw2hEJgi&_nc_ohc=9aB-pU3IG3cAX_PhXF3&_nc_ht=scontent.fklo1-1.fna&oh=00_AfBVSk5i1hIqV3iHSR3eCQWkv850tP2_FUs1ankNF13oXw&oe=6449A2E8" width="250" height="150" style="border:5px double black;" #000000; padding:3px>
    <img src="https://scontent.fklo1-1.fna.fbcdn.net/v/t39.30808-6/336902822_903503027557074_8904806546511024539_n.jpg?_nc_cat=105&ccb=1-7&_nc_sid=0debeb&_nc_eui2=AeHa8bXIEW5_x344SROXHM-E034QancDv7XTfhBqdwO_tciBb8RrGozlnPorggcaTu62vBQqxnuPpnUWnqJ1XvWY&_nc_ohc=gbm6LVVEBOMAX9S8Tv2&_nc_ht=scontent.fklo1-1.fna&oh=00_AfDMan2OY5v36s-b003yKkP6-FDt0eTdWxxKbJW2gDwppw&oe=6449603D" width="300" height="150"  style="border:5px double black;" #000000; padding:3px>
</div>
    
<div>
    <h2>Coffee Date ♡ </h2>
    <p>Starbucks, Boracay</p>
    <img src="https://scontent.fklo1-1.fna.fbcdn.net/v/t39.30808-6/336899301_1376912633101904_2461713850158336723_n.jpg?stp=cp6_dst-jpg&_nc_cat=102&ccb=1-7&_nc_sid=0debeb&_nc_eui2=AeFYIS8ws5uq6dTjhX8V2TIdbbMGbpKUaURtswZukpRpRJHrOrCxomi6O4OHeCIp0UsIMFMuQt8kUv70g-lX2gdA&_nc_ohc=sbWlYfl1VOYAX_m6ekd&_nc_ht=scontent.fklo1-1.fna&oh=00_AfBD0qb-Zw_1ZTO0DeqgHvfmt3N4eZh2KKFn_1JTR49wDw&oe=64489418" width="200" height="250" style="border:5px groove gold;" #000000; padding:3px> 
    <img src="https://scontent.fklo1-1.fna.fbcdn.net/v/t39.30808-6/342887037_183493384524312_5132783108776358599_n.jpg?stp=cp6_dst-jpg&_nc_cat=110&ccb=1-7&_nc_sid=0debeb&_nc_eui2=AeGxeop9ovogoI-_kjj2TP1_-1OxhMMiOnj7U7GEwyI6eK331cHT4Toi0V1Hj8HqvvaABdSH54_guYPJ0_5B3du7&_nc_ohc=CiC1mLI0mtgAX_XSE6o&_nc_ht=scontent.fklo1-1.fna&oh=00_AfCPBf5NVS_zxaANABrSmlSLx2W2FTEqafNTfkxg77Zt7Q&oe=64484CBA" width="200" height="250"  style="border:5px groove gold;" #000000; padding:3px> 
    <img src="https://scontent.fklo1-1.fna.fbcdn.net/v/t39.30808-6/343166885_225683580058565_4193065843334503175_n.jpg?stp=cp6_dst-jpg&_nc_cat=105&ccb=1-7&_nc_sid=0debeb&_nc_eui2=AeEqtP5r4d26HY6mqj8pNRpkUc_S2Zg7xTtRz9LZmDvFO8PtuhsPqi-LjjGAt3AtI8xKGqhc6cOZiPYny6KczS9s&_nc_ohc=jHTouu3QEaEAX-RzKER&_nc_ht=scontent.fklo1-1.fna&oh=00_AfBtpJJFEEwkEtW8v_FOdLhD6v_3KsAU_YEZ4GU2fFFtFw&oe=64497714" width="200" height="250"  style="border:5px groove gold;" #000000; padding:3px> 
</div>
        
<div>
    <h2>Sunset 🌅 </h2>
    <p>Front Beach, Station 2 Boracay</p>
    <img src="https://scontent.fklo1-1.fna.fbcdn.net/v/t39.30808-6/342511250_599311242170053_8082855659083743729_n.jpg?stp=cp6_dst-jpg&_nc_cat=108&ccb=1-7&_nc_sid=0debeb&_nc_eui2=AeG3WxVWs5dgk9lwgb-nfFOFPLF6oemjxdU8sXqh6aPF1XUln2mX9ijZwExKan6ZDeXQ0fCzxCFYKUVduOHkQ4-W&_nc_ohc=cvqXCCFqvYcAX-I6_BH&_nc_ht=scontent.fklo1-1.fna&oh=00_AfDI6hov2ngpZ8GGSZCD2Y6mygphnlg5Klnys4GuNxKclA&oe=644900FA" width="200" height="150" style="border:10px solid goldenrod;" #000000; padding:3px>
    <img src="https://scontent.fklo1-1.fna.fbcdn.net/v/t39.30808-6/342981821_573089644919696_2017526801674845898_n.jpg?stp=cp6_dst-jpg&_nc_cat=100&ccb=1-7&_nc_sid=0debeb&_nc_eui2=AeH4ULr7DTGOicNNWTRY-sSAHo_A1AILPCAej8DUAgs8IKDUXYXH5qYhn-vvWecLgBCLuCLa1wg5t3z7M-FSVb1e&_nc_ohc=Swsg60JtysIAX8CkAQs&_nc_ht=scontent.fklo1-1.fna&oh=00_AfDq6suXNitJ0MwVGXXRR1hk6nME_dvHV_vXFolEmhunaA&oe=6447F643" width="200" height="150" style="border:10px solid dodgerblue;" #000000; padding:3px>
</div>
​
<div>
    <h2>Boracay NewCoast 🐚 </h2>
    <p> Yapak, Malay, Aklan </p>
    <img src="https://scontent.fklo1-1.fna.fbcdn.net/v/t39.30808-6/342814403_3566356506931036_3442099173585918417_n.jpg?stp=cp6_dst-jpg&_nc_cat=102&ccb=1-7&_nc_sid=0debeb&_nc_eui2=AeHB5aUjiIKUgjU8wr6XRdGI6daPHGflSNzp1o8cZ-VI3HzSgS-rqgPKyTrq3sWnojp5aoKo0LaeFEPT7lUXV6If&_nc_ohc=iZY8gRNDHBEAX-f9YBf&_nc_ht=scontent.fklo1-1.fna&oh=00_AfA1Yv8KpKR2au8kR39whlWvEld37sLex76BA18X_6QmZw&oe=64480BB1" width="200" height="150" style="border:10px outset silver;" #000000; padding:3px>    
    <img src="https://scontent.fklo1-1.fna.fbcdn.net/v/t39.30808-6/343000926_750048816564089_7035367586017523765_n.jpg?stp=cp6_dst-jpg&_nc_cat=106&ccb=1-7&_nc_sid=0debeb&_nc_eui2=AeHOJmTNSoNYGmYs5mKfAP92l-yFSucFcdKX7IVK5wVx0jAjKBbw2fVvwnVIlzIFZPIZzrA4TiNqgDr0DqYg1o9W&_nc_ohc=7jQXbbTgJH8AX_7HPu7&_nc_ht=scontent.fklo1-1.fna&oh=00_AfAg8xMlnkLs-b797Hvfy2_FYgxMnPC5v3AVzLe2EUZYQw&oe=6447E40B" width="200" height="250" style="border:10px outset silver;" #000000; padding:3px>
</div>
​
<div>
    <h2>Halo Mango Boracay 🍨 </h2>
    <p>D'Mall, Station 2, Boracay, Philippines </p>
    <img src="https://scontent.fklo1-1.fna.fbcdn.net/v/t39.30808-6/342984149_898907047848741_3842710518235169577_n.jpg?stp=cp6_dst-jpg&_nc_cat=106&ccb=1-7&_nc_sid=0debeb&_nc_eui2=AeG8-HSN78XITYD2Sew0FroEDkqx7URqt9YOSrHtRGq31jZk1smKPQvFED_eEI2zLuOghUqsNamRro8OLgtONaWT&_nc_ohc=almGlTOWSDUAX-QvDIl&_nc_ht=scontent.fklo1-1.fna&oh=00_AfBvMq-Nfj7fXlOn2_tW8msInVoL-1_lxVll7XPO5PA9yw&oe=64485735" width="200" height="250" style="border:5px dashed red;>
</div>
​
<div>
    <h1>Information About Me</h1>
</div>
    <body>
        <div class="container">
        <h2>My personal information</h2>
​
        <table class="table">
            <tr>
                <th>
                    @Html.DisplayNameFor(model => model.First_Name)
                </th>
                <th>
                    @Html.DisplayNameFor(model => model.Middle_Name)
                </th>
                <th>
                    @Html.DisplayNameFor(model => model.Last_Name)
                </th>   
                <th>
                    @Html.DisplayNameFor(model => model.Nickname)
                </th>   
                <th>
                    @Html.DisplayNameFor(model => model.Age)
                </th>   
                <th>
                    @Html.DisplayNameFor(model => model.CourseMajorSection)
                </th>       
                <th>
                    @Html.DisplayNameFor(model => model.Gender)
                </th>   
                <th>
                    @Html.DisplayNameFor(model => model.Birthdate)
                </th>       
                <th>
                    @Html.DisplayNameFor(model => model.Place_of_Birth)
                </th>   
                <th>
                    @Html.DisplayNameFor(model => model.Civil_Status)
                </th>
                <th>
                    @Html.DisplayNameFor(model => model.Address)
                </th>
                <th>
                    @Html.ListBox("Nationality", new List<SelectListItem> {
                    new SelectListItem { Text="American", Value="1"},
                    new SelectListItem { Text="Canadian", Value="2"},
                    new SelectListItem { Text="Filipino", Value="3"},
                    new SelectListItem { Text="Russian", Value="4"},
                    new SelectListItem { Text="Swedish", Value="5"},                    
                    new SelectListItem { Text="Korean", Value="6"},                
                    new SelectListItem { Text="Japanese", Value="7"},                      
                    new SelectListItem { Text="Indian", Value="8"},                 
                    new SelectListItem { Text="Scottish)", Value="9"},
                    new SelectListItem { Text="Others...", Value="10"}
                    }, new { @class="form-control" })
                </th>   
                <th>
                    @Html.DisplayNameFor(model => model.Zipcode)
                </th>
                <th>
                    @Html.DisplayNameFor(model => model.Email_Address)
                </th>       
                <th>
                    @Html.DisplayNameFor(model => model.Cellphone_No)
                </th>   
                <th>
                    @Html.DisplayNameFor(model => model.Height)
                </th>
                <th>
                    @Html.DisplayNameFor(model => model.Weight)
                </th>
            </tr>
​
@foreach (var item in Model) {
        <tr>
            <td>
                @Html.DisplayFor(modelItem => item.First_Name)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.Middle_Name)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.Last_Name)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.Nickname)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.Age)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.CourseMajorSection)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.Gender)
                
                @Html.DropDownList("Gender", new List<SelectListItem> {
                new SelectListItem {Text="Select Gender",Value="-1" },
                new SelectListItem {Text="Male",Value="1" },
                new SelectListItem {Text="Female", Value="2" },
                new SelectListItem {Text="Bisexual", Value="3" },
                new SelectListItem {Text="Gay", Value="4" },
                new SelectListItem {Text="Transgender", Value="5" },
                new SelectListItem {Text="Lesbian", Value="6" }
                }, new { @class = "custom-select" })                    
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.Birthdate)
            </td>           
            <td>
                @Html.DisplayFor(modelItem => item.Place_of_Birth)
            </td>           
            <td>
                @Html.DisplayFor(modelItem => item.Civil_Status)
                
                @Html.DropDownList("Civil_Status", new List<SelectListItem> {
                new SelectListItem {Text="Select Status",Value="-1" },
                new SelectListItem {Text="Single",Value="1" },
                new SelectListItem {Text="Married", Value="2" },
                new SelectListItem {Text="Widowed", Value="3" },
                new SelectListItem {Text="Single Parent", Value="4" },
                new SelectListItem {Text="Divorced", Value="5" }
                }, new { @class = "custom-select" })
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.Address)
            </td>
            <td>
                    @Html.ListBox("Nationality", new List<SelectListItem> {
                    new SelectListItem { Text="American", Value="1"},
                    new SelectListItem { Text="Canadian", Value="2"},
                    new SelectListItem { Text="Filipino", Value="3"},                   
                    new SelectListItem { Text="Russian", Value="4"},
                    new SelectListItem { Text="Swedish", Value="5"},                    
                    new SelectListItem { Text="Korean", Value="6"},                    
                    new SelectListItem { Text="Japanese", Value="7"},                      
                    new SelectListItem { Text="Indian", Value="8"},             
                    new SelectListItem { Text="Scottish)", Value="9"},
                    new SelectListItem { Text="Others...", Value="10"}
                    }, new { @class="form-control" })   
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.Zipcode)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.Email_Address)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.Cellphone_No)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.Height)
            </td> 
            <td>
                @Html.DisplayFor(modelItem => item.Weight)
            </td> 
        </tr>
}
        </table>    
</body>
</html>
​

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using Santiago.Models;

namespace Santiago.Controllers
{
    public class StudentController : Controller
    {
        // GET: Student
        public ActionResult Index()
        {
			var studentList = new List<Student>
			{ 
				new Student() { First_Name = "Jilliane Joy", Middle_Name = "Branal", Last_Name = "Santiago", Nickname = "Jelyan", Age = 21, CourseMajorSection = "BTVTEd CSSP 2A", Birthdate = "March 27, 2002", Place_of_Birth = "Kalibo Aklan", Address = "Poblacion, Lezo, Aklan", Zipcode = "5606", Email_Address = "santiagojilliane8@gmail.com", Cellphone_No = "09055474909", Height = "157.48 cm", Weight = 69}
		   };
        	return View(studentList);
        }
    }
}

Controller

 
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using Santiago.Models;
​
namespace Santiago.Controllers
{
    public class StudentController : Controller
    {
        // GET: Student
        public ActionResult Index()
        {
            var studentList = new List<Student>
            { 
                new Student() { First_Name = "Jilliane Joy", Middle_Name = "Branal", Last_Name = "Santiago", Nickname = "Jelyan", Age = 21, CourseMajorSection = "BTVTEd CSSP 2A", Birthdate = "March 27, 2002", Place_of_Birth = "Kalibo Aklan", Address = "Poblacion, Lezo, Aklan", Zipcode = "5606", Email_Address = "santiagojilliane8@gmail.com", Cellphone_No = "09055474909", Height = "157.48 cm", Weight = 69}
           };
            return View(studentList);
        }
    }
}
​

View in Full Screen

View IL Code