Hash/pound # symbol in HTML tags within Javascript

Question

I was hooking up my kendo list view to a php datasource using a forum post on Kendo UI.

1. It works but can you please explain that last line where they use # symbol.
2. And what about :data.Name? I do understand that I am outputing JSON string from the php file like {"data":[{"Name":"Cindy"}]). But from the context of Javascript, what is Kendo actually doing here with 'data' from the JSON string? Is it an object(in some data structure?) with property 'Name'? why is there a semicolon?

I do not have a good background in JavaScript and found it hard to search with #/hash as keyword.

    $("#listView").kendoListView({
    dataSource: {
        transport: {
            read: "list_users.php",
        },
        schema: {
            data: "data"
        }
    },
    template:"<li>#:data.Name#</li>"

});

Answer 1

To Javascript it doesn't have any special meaning at all. It's just a string.

When used in a Kendo template, the tag #: # is replaced with a HTML encoded value. (The tag #= # is replaced with a value without HTML encoding.)

Using the template directly in code, it would look like this:

var template = kendo.template("<li>#:data.Name#</li>");

var html = template({ data: { Name: 'Me!<o>' } });

The variable html would now contain the string <li>Me!&lt;o&gt;</li> . Notice how the < and > from the name are HTML encoded.