** Update 1-30-2013.. It looks like jsrender is the replacement for jquery templates but it is not as mature as knockout at this time..

Knockout seems like all the rage right now so i'm hitching a ride on the bandwagon, and it's fun!

Since I finally figured out scope in javascript the revealing module pattern is my GOTO pattern.  It feels like web forms code behind with wired up events.

The jquery template plugin is no longer being developed to render html templates. I'm using KO along with the revealing module pattern to do the same work as jquery template.

 

And the javascript source

/// <reference path="knockout-2.2.0.js" />
/// <reference path="jquery-1.8.3.intellisense.js" />
var Ch = Ch || {};
Ch.BlogIndex = function () {

    var wireAutoComplete = function (quickSearches) {
        $('#quick-search').autocomplete({
            source: quickSearches
        });
    };

    var wireSearchToggle = function () {
        var $container = $('#blog-search-container');
        var $toggler = $('#toggler');
        $container.toggle();
        $toggler.click(function () {
            $container.slideToggle(150, function () {
                $toggler.text($container.css('display') === 'none' ? 'search' : 'hide');
            });
        });
    };

    var viewModel = function () {
        return {
            blogEntries: ko.observableArray([])
        };
    }();

    var applyKoTemplate = function () {
        ko.applyBindings(viewModel);
    };

    var processKeywordLinks = function () {
        $.each($('.js-process-keyword-links'), function (index, item) {
            var html = '';
            var $item = $(item);
            $.each($item.text().split(','), function (count, keyword) {
                var comma = (count === 0 ? '' : ', ');
                html += comma + '' + $.trim(keyword) + '';
            });
            $item.html(html);
        });
    };
    
    var handleSearchResults = function (payLoad) {
        viewModel.blogEntries(payLoad);
        $('#razor-result').hide();
        processKeywordLinks();
    };

    var ajxQuickSearch = function (searchTerm) {
        $.ajax(
            {
                url: '/Blog/BlogSearch',
                type: 'GET',
                data: { 'searchTerm': searchTerm },
                success: function (ajxResult) {
                    if (ajxResult.IsSuccess) {
                        handleSearchResults(ajxResult.Payload);
                    } else {
                        alert(ajxResult.ErrorMessage);
                    }
                }
            });
    };

    var wireSearchClick = function () {
        $('#search-blogs-btn').click(function () {
            var searchTerm = $.trim($('#quick-search').val());
            if (searchTerm.length > 0) {
                ajxQuickSearch(searchTerm);
            }
        });
    };

    var wireKeywordClick = function () {
        $('body').on('click', '.js-keyword-search', function () {
            var $self = $(this);
            var keyWord = $.trim($self.text());
            if (keyWord) {
                ajxQuickSearch(keyWord);
            }
        });
    };

    var init = function (quickSearches) {
        wireAutoComplete(quickSearches);
        wireSearchToggle();
        wireSearchClick();
        applyKoTemplate();
        wireKeywordClick();
    };

    return {
        'wireBlogIndex': init
    };
}();