My.I.T.Side

How to use DevExpress MVC Gridview using Entity Framework 4

Filed under ASP.NET MVC 3

In Controller:

We assume that you already created your model using Entity Framework 4 and generated a model class from your database.

public ActionResult Categories(){
      ModelEntities dbContex = new ModelEntities();
      return View(dbContex.Categories.ToList());     
}

Now let's create PartialView.

public ActionResult CategoryPartial() {

     var model = _db.SelectCategories();
     return PartialView("CategoryPartial", model);
}

In View:

Let's add the devexpress css and js.

@Html.DevExpress().GetStyleSheets( 
        new StyleSheet { ExtensionSuite = ExtensionSuite.NavigationAndLayout }, 
        new StyleSheet { ExtensionSuite = ExtensionSuite.Editors }, 
        new StyleSheet { ExtensionSuite = ExtensionSuite.HtmlEditor }, 
        new StyleSheet { ExtensionSuite = ExtensionSuite.GridView }, 
        new StyleSheet { ExtensionSuite = ExtensionSuite.Chart },
        new StyleSheet { ExtensionSuite = ExtensionSuite.Report } 
)

@Html.DevExpress().GetScripts( 
        new Script { ExtensionSuite = ExtensionSuite.NavigationAndLayout }, 
	    new Script { ExtensionSuite = ExtensionSuite.HtmlEditor }, 
	    new Script { ExtensionSuite = ExtensionSuite.GridView }, 
	    new Script { ExtensionSuite = ExtensionSuite.Editors }, 
        new Script { ExtensionSuite = ExtensionSuite.Chart },
	    new Script { ExtensionSuite = ExtensionSuite.Report } 
)

@Html.Partial("CategoryPartial", Model)

In PartialView:

@Html.DevExpress().GridView(
        settings => {
            settings.Name = "gvCategories";
                
            settings.CallbackRouteValues = new {Controller = "Admin", Action = "CategoryPartial" };
            
            settings.Columns.Add("CategoryId").Caption = "ID";
            settings.Columns.Add("Title");
            settings.Columns.Add("Description");

            settings.Columns.Add(
                column => {
                    column.Caption = "Action";
                    column.SetDataItemTemplateContent(c => {
                        ViewContext.Writer.Write(
                            Html.ActionLink("Edit", "EditCategory", new { id = DataBinder.Eval(c.DataItem, "CategoryId") }) + "&nbsp" +
                            Html.ActionLink("Delete", "DeleteCategory", new { id = DataBinder.Eval(c.DataItem, "CategoryId") },
                                new { onclick = "return confirm('Do you really want to delete this record?')" })
                        );
                    });
                }
            );
                
}).Bind(Model).GetHtml()

Happy Coding