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

<div class="container-fluid placeholders">
    <div class="row">
        <div class="col-xs-4 col-md-2 placeholder">
            <img class="img-responsive " alt="200x200" src="Images/200.png">
        </div>
        <div class="col-xs-10 col-md-3">
            <h2>Lorem ipsum dolor sit amet...</h2>
            <p>
                Lorem Ipsum is simply dummy text of the printing and typesetting industry.
                Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a
                galley of type and scrambled it to make a type specimen book.
            </p>

            <p>
                @(Html.Kendo()
                .Button()
                .Name("PrimaryButton")
                .Content("Hide column")
                .HtmlAttributes(new { @class = "textButton k-primary" }))
            </p>
        </div>

        <div class="col-xs-10 col-md-3">
            <h2>&nbsp;</h2>
            <p>
                Lorem Ipsum is simply dummy text of the printing and typesetting industry.
                Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a
                galley of type and scrambled it to make a type specimen book.
            </p>
            <p>
                @(Html.Kendo()
                .Button()
                .Name("TextButton")
                .Content("Button")
                .HtmlAttributes(new { @class = "textButton" }))
            </p>

        </div>
        <div class="col-xs-10 col-md-3">
            <h2>&nbsp;</h2>
            <p>
                Lorem Ipsum is simply dummy text of the printing and typesetting industry.
                Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a
                galley of type and scrambled it to make a type specimen book.
            </p>

            <p>
                @(Html.Kendo()
                .Button()
                .Name("Button")
                .Content("Button")
                .HtmlAttributes(new { @class = "textButton" }))
            </p>

        </div>
    </div>
</div>
<div class="container-fluid">
    <div class="row">
        <div class="col-xs-18 col-md-12">
            @(Html.Kendo().Grid<AllowCopyWithHiddenColumn.Models.OrderViewModel>()
        .Name("grid")
        .Columns(columns =>
        {
            columns.Bound(p => p.OrderID).Filterable(false);
            columns.Bound(p => p.Freight);
            columns.Bound(p => p.OrderDate).Format("{0:MM/dd/yyyy}");
            columns.Bound(p => p.ShipName);
            columns.Bound(p => p.ShipCity);
        })
        .Pageable()
        .Sortable()
        .Scrollable()
        .Filterable()
        .Selectable(selectable => selectable
        .Mode(GridSelectionMode.Multiple)
        .Type(GridSelectionType.Row))
        .Resizable(resize => resize.Columns(true))
        .AllowCopy(true)
        .HtmlAttributes(new { style = "height:550px;" })
        .DataSource(dataSource => dataSource
        .Ajax()
        .PageSize(20)
        .Read(read => read.Action("Orders_Read", "Grid"))
        )
            )
        </div>
    </div>
</div>
<script>

    $('#PrimaryButton').click(function (e) {
        $('#grid').data('kendoGrid').hideColumn(1)
    })
</script>