Ad

Search This Blog

Thursday, May 21, 2015

How to bind the Web Grid in MVC4 using C#

View:-


@{
 
    Layout = "~/Views/Shared/_AdLayout.cshtml";
    var grid = new WebGrid(source: Model, rowsPerPage: 10);
    grid.Pager(WebGridPagerModes.All);
  
}

 
 <div id="">
        <table >
            <tr>
                <td align="left" colspan="2" style="vertical-align:top;">
                    @grid.GetHtml(tableStyle: "webgrid-table",
                        headerStyle: "webgrid",
                        footerStyle: "webgrid-footer",
                        alternatingRowStyle: "webgrid-alternating-row",
                        rowStyle: "webgrid-row-style",
                    columns:
                     grid.Columns
                        (
                            grid.Column("CompanyName", "Company Name"),
                            grid.Column("FileName", "FileName "),
                            grid.Column("FileUploadDate", "File Uploaded Date"),
                        ))
                 </td>
            </tr>
      
    </div>



C# Code:

 public ActionResult SupplierDocuments()
        {
            var fileContentViewDetails = new List<FileContentViewDetails>();
            var supplierRepository = new SupplierRepository();
            try
            {
                var userId = Convert.ToInt32(Session["UserId"].ToString().Trim());
                fileContentViewDetails = sRepository.GetSuppliersDocumentData(userId).ToList();
            }
            catch (Exception ex)
            {

            }
            return View(fileContentViewDetails.ToList());
        }



Grid Styles:
-------------------------
  /*Here we will add css for style webgrid*/
    .webgrid-table {
        font-family: Calibri;
        font-size: 13px;
        width: 1350px;
        display: block;
        border-collapse: separate;
        background-color:#D0DFFA;
    }
   
    .webgrid-table th
        {
            font-weight: 500;
            background-color:#6495ED ;
            color:#1E2D47;
            padding: 10px;
            border: 1px solid;
            border-color:lightgray;

    }
    .webgrid-table a:link,.webgrid a:visited,.webgrid a:active,.webgrid a:hover {
        color: #fff;

    }
    .webgrid-table a:hover {
        text-decoration:underline;

    }
    .webgrid-table tr.gridAltRow{background-color: #D0DFFA;}
    .webgrid-table td{padding: 5px;color: #333; border: 1px solid;border-color:#D0DFFA;}
    .webgrid-table-footer {
        color:#1E2D47;
        background-color: #D0DFFA;
    }

    .webgrid-row-style {
        padding: 3px 7px 2px;
        height:34px;
        background-color:#FFFFFF;
    }

    .webgrid-alternating-row {
        border:1px solid;
        border-color:#00BFFF;
        background-color: #E8F4FF;
        padding: 3px 7px 2px;
        height:34px;
    }

    .col-sm { width: 150px; min-width: 90px;  }

    .col-emails { width: 190px; min-width: 90px; }

     .col-RejectedReason { width: 250px; min-width: 180px; }
.col-headercolor {
    color: white;
}


No comments:

Post a Comment