Unable to render columns

[Man]

I have a search form which will get a list of records.
I would like to bind the search results on pressing submit after performing some initial ​checks on the entered data. How do i bind my action result to the Kendo Grid ?
 My JS File is 
function validateDataForSearch() {
        var empNo = $("#empNo").val();
        var empName = $("#empName").val();
        var empMgr = $("#empMgr").val();
        var clientName = $("#ClientName").val();

        var noValues = empNo.length + empName.length + empMgr.length + clientName.length;

        if (noValues <= 0) {
            alert("Please enter at least one value to be able to search.");
        }
        else {
            if (empNo.length <= 0)
                empNo = 0;
            $.ajax({
                type: "POST",
                url: 'Home/Search',
                data: { empNo: empNo, empName: empName, empMgr: empMgr, clientName: clientName },
                success: function (response) {                
                        $("#pmtSearchResult").getKendoGrid().dataSource.data(response);
                        }
            });
        }​;

 

  function get​EmpLink(project) {
        var action = '@Url.Action("Index","PMP", new { ​emp= '+ ​emp +')';
        var ​empLink = kendo.format("<a href='{0}'>{2}</a>", action, ​emp.empNo);
        return empLink;
    }

 var validator = $("#searchForm").kendoValidator().data("kendoValidator");

    $("#btnSearch").click(function (e) {        
        if (!validator.validate()) {
            e.preventDefault();
        }
        else
            validateDataForSearch();
    });

 

 

 

My CSHTML is as follows

@model IEnumerable<PMT.Models.EmpData> 
<div id="kendoGrid">
    @(Html.Kendo().Grid(Model)
    .Name("SearchResult")
    .Columns(columns =>
    {
        columns.Bound(p => p.empNo).ClientTemplate("#= getEmpLink(data) #");
        columns.Bound(p => p.empName);
        columns.Bound(p => p.empMgr);
        columns.Bound(p => p.ClientName);

        columns.Bound(p => p.empSal).hidden(true);

    })
    .Pageable()
    .Sortable()
    .Scrollable(scr => scr.Height(430))
    .Filterable()
    .DataSource(dataSource => dataSource
        .Ajax()
        .PageSize(20)
        .ServerOperation(false)
     )
    )​

 

I cant seem to render the grid to hide the empSal column or to show  the emloyeeid column as a hyperlink column

[Rosen]

Hello Man,

I have looked at the code snippets you have pasted. It seems that there are few syntax errors, for example:

'@Url.Action("Index","PMP", new { ​emp= '+ ​emp +')';

//Note the missing } bracket at the end and the emp variable which is not defined.

Also if I understood correctly this line is part of a JavaScript file, thus I suspect that the Razor code will not be executed at all. 

Another thing I have noticed is the incorrect casing of the Column Hidden method, note the pascal casing. 

The $.ajax success handler is referencing an incorrect element, as the Grid widget element ID seems to be SearchResult instead of pmtSearchResult.

 

Regards,
Rosen
Telerik