Scope of "this" for column templates

3 posts, 0 answers
  1. Alan
    Alan avatar
    7 posts
    Member since:
    May 2014

    Posted 14 May 2014 Link to this post

    Very surprised I couldn't find more information on this. Most grid libraries allow direct js functions for their column renders. In the case of Kendo UI it must be a string template, which is quite limiting. The problem I am currently facing is this:

    // Inside my view
    config: {
      a: "A",
      b: "B"
    foo: function(data) {
      return this.config[data.config];
    initGrid: function() {
        columns: [{ 
          title: "Column A",
          field: "columnA",
          template: "#= #"

    I have no way to access a member method in my template. This is crazy limiting. ANY of the following scenarios would be workable:

    // Direct function access
    // Set scope of template execution
    template: { template: "#= #", scope: this }
    // Templates always executed in scope they are defined in
    template: "#= #"  // Just works

    The current requirement that only global methods can be called is severe (not to mention a terrible practice). Please advise on how to circumvent this limitation.
  2. Alexander Valchev
    Alexander Valchev avatar
    2873 posts

    Posted 16 May 2014 Link to this post

    Hi Alan,

    By default the context of Kendo template is the global window object. If you want to change the content of a template you can use jQuery proxy.
    For example:
    template: { template: $.proxy(kendo.template("#= #"), { foo: "bar" }) }

    Actually you can also use direct function access (because kendo.template actually compiles a JavaScript function).

    For example:

    <div id="grid"></div>
        var foo = {
            bar: function(data) {
                return + "_format";
            baz: function() {
                    dataSource: {data:[{name: "One"}, {name: "Two"}]},
                    columns: [
                    { field: "name" },
                    { template: }

    Alexander Valchev
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  3. Alan
    Alan avatar
    7 posts
    Member since:
    May 2014

    Posted 17 May 2014 in reply to Alexander Valchev Link to this post

    Excellent news! Thanks for the clarification, there is no mention of direct function access in the docs. Would nice to have them updated.
Back to Top