How to load JSON with HTML Plugin? - json

There was a plugin I used with loading contents of a JSON object into HTML. One of them was called jquery.loadJSON(jsondata) written by Jovan Popovic. The last version is 2011.
It has worked well but I've noticed that it does not populate the select drop downs.
If not this plugin can anyone recommend a similar plugin that loads and binds the json to the html objects?
One I studied is called JSON2HTML but this is a dynamic content loader which I do not want.
Another one was called JQuery templating but it looks like the project was abandoned?
thanks,

The most popular solutions for templating are Handlebars.js and Mustache.js (the former being an extension of the latter). Swig is also pretty popular. For a somewhat different templating style, you can go for the ERB-style underscore templates.
Note: as of now, templating libraries rather work with placeholder tags, eg. {{data}}, than by associating content with id, class, name. The templating libraries I mentioned also allow you to put loops and conditionals among others, in your HTML.
For a full list on the better Javascript templating engines, check out JSDB.io.

Related

Template engine for header & footer

I'm looking for a simple template engine that allows me to create snippets
for the header, footer etc.
Can anyone guide me on how to start here?
Many thanks!
I believe your referring to partials, there are countless libraries and frameworks that supply this functionality, here are just some of them...
EJS - This is now no longer maintained however it's functionality is still perfect as it comes, provides a simple partial engine and data visualisation.
Handlebars - Oh how so many frameworks use this library, fantastic bit of kit, however this has greater power than just simply loading other files.
AJAX - You can just load a basic HTML file via JQuery .load instead as per the documentation like this...
$( "#result" ).load( "ajax/test.html #container" );
Additionally any respected front-end framework will usually come packed with an engine to load partials with ease.
When you make your partials, be sure to prefix them with an underscore, this is good practice to allow other developers to recognize partials.

Dart HTML templating on the client: Separating HTML from Dart code

Looking to create HTML elements as part of a Dart client side application.
There are multiple approaches to doing this.
Ideally the HTML template to create new elements would live with the rest of the HTML and not inline with Dart code.
Are there any options for separating HTML templates and Dart code?
Background
Common approaches to creating HTML content on the fly:
Create in Code, as explained here: How to create an HTML link in Dart?
Input as a String from Code, also explained in the above link.
Use Polymer, which does solve this, although appears to require boilerplate.
Polymer would appear to be overkill for use cases which don't require custom elements, data binding and other features.
There was at one point the DART HTML Template Library, work now stopped:
http://blog.sethladd.com/2012/03/first-look-at-darts-html-template.html
There is also the HTML5 'template' element. The HTML5 'template' tag has limited (50%) support at caniuse.com which currently limits it's applicability.
You can use the template_binding package which is what Polymer uses for its templates. You might also want to use the polymer_expressions package for a more powerful expression syntax.
The important bit is that you don't need all of Polymer to use those. Check out the polymer_expressions tests for examples of using template_binding without the rest of Polymer.

HTML Layout/Templating

I am building a website where i'm looking to create html templates which contain placeholders where i'll be able to inject pages/content, menus, etc.... I really like AngularJS which has good support for this but am thinking that it might be a bit of an overkill for what i'm building. There is a chance some parts of the application will eventually be ripped out and run standalone and so dont want to tie the html/javascript to a library which requires so much framework specific syntax. Are there any other, simpler libraries, that will allow me to do this? thanks in advance
/Eric
KnockoutJS is pretty lightweight and also includes a templating feature.
I wouldn't just dismiss angularjs because it seems like a heavy framework. There are very simple ways to use it without using any of the "advanced" features like routing, creating services, creating directives, etc. You can simply have a controller and use the built in directives to do a lot of powerful things on a single page. Angular is also pretty small and is easily bootstrapped with the ng-app tag anywhere in your DOM.

Available Options for HTML Static File Templating

What are the most common options for templating HTML files for static pages, to minimize maintenance and redundancy? An example of my question would be Adobe Dreamweaver.
Consider using a server-side scripting language such as PHP or ASP.NET. These produce dynamically built web-pages meaning that you can code it in such a way that headers/footers etc are separate from the main content, meaning you change that link once rather than 30 times.
If server-side scripting is not an option, I'd suggest having a look at Dreamweaver. This will enable you to create templates, and then create pages based on those templates. When you modify that link in the template, all pages that use that template will be updated. This will give you what you want without the server-side scripting.
why dont you use iframe inside ? ( which will contain a single navigation html page...)?
If you're using a server-side language like PHP, you can start to use the include function. So you'll include in a different file your navigation bar and then include it in every file of your website. Thus, every change to the navigation bar file will affect all the others files.
If you are writing only static pages, it isn't possible. Maybe you can try SSI.
Typically you need either a fancy program (like Dreamweaver and its templates functionality) or some sort of server-side scripting. Languages like php, asp, etc might be a bit much if the only thing you are looking to do is as you describe, so I might look into seeing if your server support server side includes (SSI).

Does Django have HTML helpers?

Does Django have any template tags to generate common HTML markup? For example, I know that I can get a url using
{% url mapper.views.foo %}
But that only gives me the URL and not the HTML code to create the link. Does Django have anything similar to Rails' link_to helper? I found django-helpers but since this is a common thing I thought Django would have something built-in.
No it doesn't.
James Bennett answered a similar question a while back, regarding Rails' built-in JavaScript helpers.
It's really unlikely that Django will ever have 'helper' functionality built-in. The reason, if I understand correctly, has to do with Django's core philosophy of keeping things loosely coupled. Having that kind of helper functionality built-in leads to coupling Django with a specific JavaScript library or (in your case) html document type.
EG. What happens if/when HTML 5 is finally implemented and Django is generating HTML 4 or XHTML markup?
Having said that, Django's template framework is really flexible, and it wouldn't be terribly difficult to write your own tags/filters that did what you wanted. I'm mostly a designer myself, and I've been able to put together a couple custom tags that worked like a charm.
The purpose of helpers is not, as others here imply, to help developers who don't know how to write HTML. The purpose is to encapsulate common functionality -- so you don't need to write the same thing a thousand times -- and to provide a single place to edit common HTML used throughout your app.
It's the same reason templates and SSI are useful -- not because people don't know how to write the HTML in their headers and footers, but sometimes you want to write it just once.
EG. What happens if/when HTML 5 is
finally implemented and Django is
generating HTML 4 or XHTML markup?
Same thing that happens when HTML 5 is implemented and all your templates are written in repetitive HTML, except a lot easier.
The other posts have already answered the question, linking to the docs on custom template tags; you can use tags and filters to build your own, but no, there aren't any built in.
it doesnt look like they're built in but here's a couple snippets. it looks like it'd be pretty easy to create these helpers:
http://www.djangosnippets.org/snippets/441/
Here is a list of all template tags and filters built into Django. Django core doesn't have as much HTML helpers as Rails, because Django contributors assumed that web developer knows HTML very well. As stated by saturdaypalace, it's very unlikely for AJAX helpers to be added to Django, because it would lead to coupling Django with a specific JavaScript library.
It's very easy to write your own template tags in Django (often you need just to define one function, similiar to Rails). You could reimplement most of Rails helpers in Django during a day or two.
I bet if there would be any consent of what is common html, there would be helpers module too, just for completeness (or because others have it). ;)
Other than that, Django template system is made mostly for HTML people, who already know how to write p, img and a tags and do not need any helpers for that. On the other side there are Python developers, who write code and do not care if the variable they put in context is enclosed by div or by span (perfect example of separation of concerns paradigm). If you need to have these two worlds to be joined, you have do to it by yourself (or look for other's code).
This won't answer directly to the question, but why not using foo in template then?