Create dynamic column Kendo Grid

Question

I am trying to create a dynamic column Kendo Grid using javascript. Now i can generate Columns dynamically. But each time it gives me a error like this.

here is the code i have using

function createDetailsGrid() {
    gridDetails = $("#gridDetails");
    gridDetails.children().remove();
    gridDetails.kendoGrid({
        columns: [],
        dataSource: []

    })

    //var columnSchema = [];
    //columnSchema.push({ title: 'One',field: 'One', width: '100px' });
    //columnSchema.push({ title: 'Two', field: 'Two', width: '100px' });
    var dataSourceContent = GetCustomers();
    var len = dataSourceContent.model.length;

    var columnSchema = [];
    var dataSourceSchema = [];

    for (var i = 0; i < len; i++) {
        columnSchema.push({ title: String(dataSourceContent.model[i].ColumnName), field: String(dataSourceContent.model[i].ColumnName), width: '100px' });
    }
    //for (var i = 0; i < len; i++) {
    //    dataSourceSchema.push({ columnSchema[i].field: 10, smv: 2.3, tot_target: 23 });
    //}

    gridDetails.kendoGrid({
        // .. other properties ..
        columns: columnSchema,
       // dataSource:[],
        pageable: true,
        sortable: true
        //editable: true,
    });

and out put like

Is there anything i have missed here?

Thank You

Answer 1

If you dont escape with '\\' it throws an error.

You have to escape the '#' when its presented in your html template like below mentioned:

<a href="\\#dashboard">Dashboard</a>