How can i get Kendo Grid DataItem

Question

How can i get the selected row KendoGrid Data Item?

I research a lot online and I came across this post http://dojo.telerik.com/egUpI which does exactly what i am looking for i would like implement the same.

I have the following code to populate grid in asp.net view. I need your help when row selected populate a elements.

Here is my Grid View:

<h1> Contacts</h1>

@{
    var gridColumnSettings = new List<GridColumnSettings>
{
        new GridColumnSettings
        {
            Member = nameof(Contact.Name),
            MemberType = typeof(string)
        },
        new GridColumnSettings
        {
            Member = nameof(Contact.PhoneNumber),
            MemberType = typeof(string)
        }
    };

    var gridViewModel = new GridViewModel
    {
        Name = "ContactGrid", // Grid Name 
        Columns = gridColumnSettings,
        AutoBind = true,
        DataSourceSettings = new GridDataSourceSettings
        {
            ReadDataSource = new DataSourceSetting()
            {
                ActionName = "Contact",
                ControllerName = "Contact",
                HttpVerb = HttpVerbs.Get,                 
            }          
        },

        SelectionSettings = new GridSelectionSettings
        {
            IsSelectable = true, // To make grid selectable
            GridSelectionMode = 0,
            GridSelectionType = 0
        },

        }
    };
}

Here is my Form on the same Page to display the selected grid row information

            <form>
                <h3>Name</h3>
                <div class="col-sm-3">
                    <input type="text" readonly class="form-control " id="Name">
                </div>      
                   <h3>Phone</h3>
                <div class="col-sm-3">
                    <input type="text" readonly class="form-control" id="Phone">
                </div>  

            </form>

I tried this Jquery, but not working

<script>
  function fillForm() {
        $("#ContactGrid").kendoGrid({
            change: function (e) {
                var dataItem = this.dataItem(this.select());
                fillForm(dataItem);
            }
        });
    }
    // Fill Form based on the selected row 

    var fillForm = function(dataItem) {
        var columns = $("#ContactGrid").data("kendoGrid").options.columns;
        var form = $("form");

        for (var i = 0; i < columns.length; i++) {
          var field = columns[i].field;
          form.find("#" + field).val(dataItem[field]);
        }
      }

</script>