In the datagrid one additonal column is showing after the column name(employeename) .
<style type="text/css">
.webgrid-table {
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
font-size: 1.2em;
width: 100%;
display: table;
border-collapse: separate;
border: solid 1px #98BF21;
background-color: white;
}
.webgrid-table td, th {
border: 1px solid #98BF21;
padding: 3px 7px 2px;
}
.webgrid-header {
background-color: #A7C942;
color: #FFFFFF;
padding-bottom: 4px;
padding-top: 5px;
text-align: left;
}
.webgrid-footer {
}
.webgrid-row-style {
padding: 3px 7px 2px;
}
.webgrid-alternating-row {
background-color: #EAF2D3;
padding: 3px 7px 2px;
}
</style>
<h2>Index</h2>
<p>
@Html.ActionLink("Create New", "Create")
</p>
@{WebGrid grid = new WebGrid(Model, rowsPerPage: 2);}
@grid.GetHtml(
tableStyle: "webgrid-table",
headerStyle: "webgrid-header",
footerStyle: "webgrid-footer",
alternatingRowStyle: "webgrid-alternating-row",
selectedRowStyle: "webgrid-selected-row",
rowStyle: "webgrid-row-style",
caption:"EMPLOYEES",columns: new[] {
grid.Column ("employeeid",header:"Emp.id"),
grid.Column ("divisionid",header:"Div.id"),
grid.Column ("departmentid",header:"Dep.id"),
grid.Column ("gender","Gender"),
grid.Column ("employeename",header:"Name"),
grid.Column ("","",format:@<td class="ActionsTH" >
@Html.ActionLink("Edit", "Edit", new { id = item.employeeid }) |
@Html.ActionLink("Details", "Details", new { id = item.employeeid }) |
@Html.ActionLink("Delete", "Delete", new { id = item.employeeid })
</td>)},
mode:WebGridPagerModes.All,
numericLinksCount: 5)