How to render data in the Kendo UI Grid using Foreach Loop

[Abhishek]

@foreach (var item in products) { 
               
<h3>
<a href="/ProductDetails/@item.productID">@item.title</a>
                </h3>
                <p>
                @Products.ShowProductThumbnail(item.productID.ToString())
            </p>
                <p class="price">
                    $@item.price
                </p>
                <p>
                    <a href="/ProductDetails/@item.productID" class="detailsButton">
                        More Details
                    </a>
                </p> 
        }

I have this code i want to display the above in a kendo ui grid

<script > $(function () { $("#grid").kendoGrid({ columns: [{ title: "Product Name" }, { title: "Product Image" }, { title: "Price" }, { title: "More Details" }], sortable: true }); }); </script>
Please help me 
Thanks in advance