Using jTemplate with ASP.NET MVC

Question

In this article, Dave Ward describes how to use the jQuery plugin jTemplate to create what he calls a "client side repeater", that parses JSON data into a template on the client side.

Toward the end of the article, he suggests that the template is placed in a separate file with the extension ".tpl", and that the data is loaded into the document with the following syntax:

function ApplyTemplate(jsonData) {
  // This method loads the HTML template and
  //  prepares the container div to accept data.
  $('#Container').setTemplateURL('myTemplate.tpl');

  // This method applies the JSON array to the 
  //  container's template and renders it.
  $('#Container').processTemplate(jsonData);
}

However, when using ASP.NET MVC I can't just place the template file next to my view and call it with "/Guestbook/myTemplate.tpl". But I would like to place the template file next to the view, to keep things together.

How should I arrange this? A Controller Action that returns the text file contents? Some configuration in Global.asax.cs to make the Framework just return these files as is, without the Controller/Action url parsing? Any other ideas?

score 2 · Accepted Answer · answered Jan 29 '09 at 16:57

2

I'd suggest using .htm instead. That comes through okay in a default MVC app.

It turns out that using .tpl is a bad idea anyway, due to some versions of IIS blocking it as an unknown file type unless you explicitly add it. I need to update my post.

answered Jan 29 '09 at 16:57

Dave Ward

59,815
13
117
134

OK, will do. Meanwhile I have used a script tag with type="text/html" with the template, and then i accessed it with $(scriptTagId).html(). However, the .setTemplate() method could not parse it - not when I hardcoded its value into the js either... Does it have to be one line? What did I do wrong? – Tomas Aschan Jan 29 '09 at 19:11
To use inline templates, I believe you need to use setTemplateElement('ElementId'). – Dave Ward Jan 30 '09 at 00:44
I tried this but without success. The js runs all the way, and debugging i find all values OK, but the content won't update. I have and ("#gbPostList").setTemplateElement('postListTemplate'); Any ideas? Thanks for all help! – Tomas Aschan Jan 30 '09 at 10:48
1

Nevermind, it's working now! Turned out my template wasn't specified the way it should have been. For future finders of this question: the inline template element has to be a textarea, and with the id property referenced in js (name is irrelevant). It can be hidden in css by display: block; Thanks! – Tomas Aschan Jan 30 '09 at 11:27

score 0 · Answer 2 · edited May 23 '17 at 12:19

0

I think, you could just ignore the route, and link to your template file like you've suggested:

Check out this previous answer: How to ignore route in asp.net forms url routing

edited May 23 '17 at 12:19

Community

1
1

answered Jan 29 '09 at 11:18

Lewis

5,769
6
30
40

Thanks for the link! I have saved my template as in ~/Views/Guestbook/postListTemplate.htm, and added the following to my Global.asax.cs:
```
routes.IgnoreRoute("Views/Guestbook/PostListTemplate.htm");
```
However, I get a 404 error when trying to open the page in firefox. What am i doing wrong?
– Tomas Aschan Jan 29 '09 at 19:06

Using jTemplate with ASP.NET MVC

2 Answers2