<div id="objConfirmationOverlay" class="clsOverlay"></div>

           <div id="objConfirmationDialog" class="clsDialog clsConfirmationPosition">

                <table style="width: 100%; border: 0px;" cellpadding="3" cellspacing="0">

                <tr>

                    <td class="clsDialogTitle">Details</td>

                    <td class="clsDialogTitle clsDialogRight">

                        <img src="Images\CloseButton.png" style="visible:false;" onclick="HideConfirmDialog('A');return false;" id="btnClose" alt="Close" />

                    </td>

                </tr>

            </table>

            @model IEnumerable<HelloWorldMvcApp.PowerForecast>

​

@{

    var grid = new WebGrid(Model, canPage: false, rowsPerPage: 30, canSort: false,

    selectionFieldName: "selectedRow", ajaxUpdateContainerId: "gridContent"); 

}

​

@grid.GetHtml(tableStyle: "webgrid-table",

    headerStyle: "webgrid-header",

    footerStyle: "webgrid-footer",

    alternatingRowStyle: "webgrid-alternating-row",

    selectedRowStyle: "webgrid-selected-row",

    rowStyle: "webgrid-row-style",

    htmlAttributes: new { id = "dgdForecast" },

    columns: grid.Columns

        (

            grid.Column("Date", " Date", style: "clsGridCell clsDateColumn", format: (item) =>

            {

                return Html.Raw(FormatCell(item.Date_Highlight.ToString(), item.ForeColor.ToString(), item.Date.ToString()));

            }),

            grid.Column("Hour", "Hour Ending", style: "clsGridCell clsHourColumn", format: (item) =>

            {

                return Html.Raw(FormatCell(item.Date_Highlight.ToString(), item.ForeColor.ToString(), item.Hour.ToString()));

            }),

            grid.Column("SetPoint", "Set Point", style: "clsNucorCellColor", format: (item) =>

            {

                return Html.Raw(FormatCell(item.Date_Highlight.ToString(), item.ForeColor.ToString(), item.SetPoint.ToString()));

            }),

            grid.Column("", "", style: "clsNucorCellColor", format: (item) =>

            {

                return Html.Raw("<input type='button' value='Edit' onclick = alert(" + item.ForeColor.ToString() + ");>");

            })

        ))

​

@functions{

    public string FormatCell(String sHighlight, String sForeColor, String sValue)

    {

        String sId = "", sStyle = "";

​

        if (sHighlight != "")

            sId = "id = highlight_row ";

​

        if (sForeColor != "")

            sStyle = "style='font-weight: bold; color: " + sForeColor + "'";

​

        return "<span " + sId + sStyle + ">" + sValue + "</span>";

    }

}

​

</div>

</div>

​

<style>

    .webgrid-table

{       

    width: 100%;

    display: table;

    border-collapse: collapse;

    /*border: solid 1px #545F5F;*/

    background-color: white;

}

.webgrid-table td, th

{

    border: 1px solid #ddd;

    border-color: #cecfcf;

    padding: 3px 7px 2px;

}

.webgrid-header

{

    background-color: #e6eeee;

    color: #0b333c;

    padding-bottom: 15px;

    padding-top: 5px;

    text-align: center;

    height: 30px;

}

​

.webgrid-row-style

{

    padding: 3px 7px 2px;

    height: 22px;

    background-color: #fdfeff;

}

.webgrid-alternating-row

{

    background-color: #e1ecf2;

    padding: 3px 7px 2px;

    height: 22px;

}

​

.clsOverlay

{

   position: fixed;

   top: 0;

   right: 0;

   bottom: 0;

   left: 0;

   height: 100%;

   width: 100%;

   margin: 0;

   padding: 0;

   background: #000000;

   opacity: .30;

   filter: alpha(opacity=30);

   -moz-opacity: .15;

   z-index: 101;

   display: block;

}

​

.clsDialog

{

    padding-left: 10px;

    padding-top: 5px;

    overflow: auto;

    display: block;

    position: absolute;

    background-color: #ffffff;

    border: 3px solid #A0B4BC;

    padding: 0px;

    z-index: 102;

    font-family: Verdana;

    font-size: 10pt;

    border-radius: 7px;

}

​

.clsConfirmationPosition

{

   width: 380px;

   height: 304px;

   top: 0%;

   left: 35%;

   z-index:103;

}

​

.clsDialogTitle

{

   border-bottom: solid 2px #A0B4BC;

   background-color: #A0B4BC;

   padding: 4px;

   color: White;

   font-weight:bold;

}

.clsDialogTitle a

{

   color: White;

   text-decoration: none;

}

​

.clsDialogRight

{

    text-align: right;

}

</style>

​

<script>

    $('.ImgAddition').on('click', function (e) {

        e.preventDefault();

        $('#hiddendiv2').show();

        $('#facilitygrid').hide();

        var bookId = $(this).prop('id');

        alert(bookId);

    });

</script>

​

​

​