Pages

Showing posts with label jQuery. Show all posts
Showing posts with label jQuery. Show all posts

Friday, January 3, 2014

Keep Your Copyright Message Fresh

There’s nothing that reeks of staleness and lack of attention, than a footer saying “copyright © 2009” in 2014. Doubly so when it’s a technology site. At best it says no one cares, at worst it suggests no one updated the site, or it’s look and feel, in years. Many times it’s not even the current maintainer’s fault: the stale message resides in a footer file, that gets included automatically with every page by a CMS system.

For my sites and web applications, as well as the ones I develop for my clients, I want to keep the copyright message fresh. It at least keeps up a pretense of someone updating the site once a year Smile. And there’s no easier way to do it then with JavaScript.

All you need to do is locate the line in your footer that looks like:
<footer>copyright © 2009</footer>
and replace the year with a <span>:
<footer>copyright © <span id="year"></span></footer> 
And add this script tag to the end of the page:
<script>
    document.getElementById('year').textContent = (new Date()).getFullYear();
</script>
Even easier: if your site is using jQuery, add this to the ready event:
$('#year').text((new Date()).getFullYear());
This way, your copyright message will always show the current year. Keeping your content fresh? Well, that’s up to you Smile.

Update:
Here's a shorter way to achieve the same effect, with one line:
<footer>copyright © <script>document.write((new Date()).getFullYear());</script></footer>

[This way is also more efficient, since no DOM selection is taking place].

Thursday, May 19, 2011

Display JSON results

JSON (JavaScript Object Notation) is a great straight forward way to transfer information from one application/server to another. It's string-based, array-oriented, and does not carry with it the redundancy of XML or (shudder) SOAP. And the best feature in a web application: it's immediately transferable to a JavaScript object, without the need for (an explicit) parsing.

Add to the mix jQuery - a JavaScript framework that makes using JavaScript and writing dynamic web pages a snap. Once I picked it up, I couldn't go back. jQuery is now embraced by many - including Microsoft and Google, who include it in their default web templates, and provide hosted CDN versions of its latest versions.

jQuery shines when it comes to AJAX transactions - you can get a JSON result from a web service using one instruction! Going over the reply is also a snatch. I found myself many times just needing to dump the results on the page - either for debugging purposes, or so I could copy/paste them somewhere.

Here is a short code snippet that I use to get a JSON result from a local web service (a remote request requires JSONP - future post), and dumps the results in a form of a list. It assumes a single-level array reply and that you have a <DIV> element on the page called "result":


        


Explanation:
  1. Line 1 includes version 1.5.2 of jQuery from the Microsoft CDN
  2. Line 4 will make sure the function will run when the document has been fully loaded and drawn
  3. Line 5 calls the JSON service and sends the results to a function
  4. Line 8 iterates over the result object and creates an array of <LI> elements
  5. Line 14 creates a new <UL> element, applies a CSS style to it, attaches the <LI> elements and places it inside the result <DIV>
That simple!