Partial view error Object reference not set to an instance of an object. MVC4 Razor

Question

i am doing a project to create a CMS for a school with MVC4 and Razor. I need to create a partial view on the index (for latest news and staff) and get at most 5 records for each of these Models i created a partial view in my shared folder but i kept having error message like this

Exception Details: System.NullReferenceException: Object reference not set to an instance of an object.

Line 1:  @model IEnumerable<MvcDale.Models.StaffModels>
Line 2:  @foreach ( var staff in Model ){
Line 3:      <div class="wrapper p4-1">
Line 4:          <figure class="img-indent3 box1">

Source File: c:\Users\Hammed\Documents\Visual Studio 2010\Projects\MvcDale\MvcDale\Views\Shared_StaffListPartial.cshtml Line: 2

this is what my partial view file is looking like

@model IEnumerable<MvcDale.Models.StaffModels>
@foreach ( var staff1 in Model ){
    <div class="wrapper p4-1">
        <figure class="img-indent3 box1">
            <img src="@Url.Content(staff1.Picture)" alt="">
        </figure>
        <div class="extra-wrap">
            <h6><a href="#">@staff1.title @staff1.sname @staff1.oname @staff1.fname</a></h6>
            @staff1.profile 
        </div>
    </div>
    }
}

And from my home index view i have the call to it like this

{
   @Html.Partial("~/Views/Shared/_StaffListPartial.cshtml")
}

can somebody help me out or suggest to me what is wrong with my code. just doing ASP.net MVC for the first time. thanks

@Dmytro

this my staffModel class

using System.Data.Entity;

namespace MvcDale.Models
{
    [Table("Staff")]
    public class StaffModels
    {
        [Key]
        [DatabaseGeneratedAttribute(DatabaseGeneratedOption.Identity)]
        public int staff_id { get; set; }
        public string title { get; set; }
        public string fname {get; set;}
        public string sname {get; set;}
        public string oname {get; set;}
        public string phone { get; set; }
        public string email { get; set; }
        public string profile { get; set; }
        public string Picture { get; set; }

    }
}

this is my index.cshtml from ~/views/home/index

@{ Layout = "~/Views/Shared/_LayoutPage1.cshtml"; }


@{
    ViewBag.Title = "Home Page";
    var Content = ViewBag.Content;
}

@section feature {
<div class="grid_11">
<div>
@Content;
</div>

                                <div class="indent-bottom10 indent-top5">
                                    <h2 class="p5"><span class="color-1">We are among</span> the leading research and teaching institutions of the world!</h2>
                                    <div class="wrapper">
                                        <div class="col-3-1">
                                            <h4 class="p2">Education Projects</h4>
                                            <ul class="list-1 p4-1">
                                                <li><a href="#">Education and Jobs</a></li>
                                                <li><a href="#">Public School Facts</a></li>
                                                <li><a href="#">International Studies</a></li>
                                                <li><a href="#">Public Engagement</a></li>
                                                <li class="last-item"><a href="#">State Testing Data</a></li>
                                            </ul>
                                            <a href="#" class="button button1">View All<span></span></a>
                                        </div>
                                        <div class="col-3-1 font-1">
                                            <h4 class="p2">General Info</h4>
                                            <p class="p5-1">Feipsumorbi nunc odiovia suorem aecena stiq cumsan malestonsetue adipiscing elit. Dolor&shy;sedum. Mauris fermen tum did oreealiquam leotum dictum magna. Sed oreet aliquam leo. Ut tellus dolor</p>
                                            <a href="#" class="button">Read More<span></span></a>
                                        </div>
                                        <div class="col-3-1 font-1 last-item">
                                            <h4 class="p2">Partners Programs</h4>
                                            <p class="indent-right4 p5-1">Nunc massa suorena stiq cumalest onsetuer adipi&shy;scing elit. Mauris fermen tum did oreet aliquam leo. Ut tellus dolor dapibuso eget elementum vel curus eleife elit. </p>
                                            <a href="#" class="button">Read More<span></span></a>
                                        </div>
                                    </div>
                                </div>
                                <div class="indent-right12">
                                    <h2 class="p6"><a href="#">Latest News</a></h2>
                                    <div class="wrapper font-1">
                                        <figure class="img-indent img-indent-none3">
                                            <img src="~/Images/teachers.png" alt="" />
                                        </figure>
                                        <div class="indent-top1 extra-wrap extra-wrap-none2 ">
                                            <p class="p2-1">Many surgeons are seriously affected on an emotional level when complications occur in the operating theatre, a study finds&shy;<a href="#" class="button">Read More<span></span></a>
                                        </div>
                                    </div>
                                </div>
                            </div>
}

@section staff_{
<h3 class="p3-1">our staff</h3>
 @model MvcDale.Models.GenModels
    @foreach ( var staff1 in Model.Staff)
    {
        @Html.Partial("~/Views/Shared/_StaffListPartial.cshtml", staff1)

    }                                                                                       

                                <a href="#" class="link">view all</a>

}

as this is my staff patial view i intend in generating a list of 5(atmost) from

@model MvcDale.Models.StaffModels

    <div class="wrapper p4-1">
        <figure class="img-indent3 box1">
            <img src="@Url.Content(Model.Picture)" alt="">
        </figure>
        <div class="extra-wrap">
            <h6><a href="#">@Model.title @Model.sname @Model.oname @Model.fname</a></h6>
            @Model.profile 
        </div>
    </div>

This is what i intend to archieve all model and dbcontext are in order i can crude the db table already

Answer 1

you have to specify model for your partial view in Html.Partial call like this

@Html.Partial("~/Views/Shared/_StaffListPartial.cshtml", Model.StaffModelsList)