CODEWITHSUNDEEP
jqueryasp.netjquery-templates
Mohammadreza
Mohammadreza

Reputation: 3229

jquery template error $(...).tmpl is not a function

I want use jquery template but it doesn't work correctly. here's my mark up Html. it's simple but i confuse why it doesn't work Correctly 

 <head runat="server">
    <script src="Resource/Scripts/jquery.min.js" type="text/javascript"></script>
        <script src="Resource/Scripts/jquery-tmpl.js"></script>    
            <script id="myTmpl" type="text/x-jquery-tmpl" >
                    <tr>
                        <td><label>${urlPic}</label></td>
                        <td><label>${name}</label></td>
                        <td><label>>${count}</label</td>
                        <td><label>${price}</label></td>
                        <td><label >${sum}</label></td>
                    </tr>
              </script>
            <script type="text/javascript">
                     jQuery(document).ready(function () {
                            var data = [{ urlPic: "abc.jpg", name: "Tom", count: "3", price: "3000000
        0", sum: "40000000" } ];

    // below line raise errro                   
                         $("#myTmpl").tmpl(data).appendTo("#baskettbl2");
                    });
            </script>
  </head>

and here's my html

    <body>
    <form id="form1" runat="server">
        <table id="baskettbl2"><table>
</form>
</body>

I get this Error:

TypeError: $(...).tmpl is not a function

EDIT: I found it doesn't work only on first request. this template is in my Master Page. When load Default. it doesn't work. but when click to another page, it works! what's the problem? i'm really confused

Upvotes: 1

Views: 11438

Answers (4)

hamzeh.hanandeh
hamzeh.hanandeh

Reputation: 743

I faced the same problem, just check the 'jquery.tmpl.min.js' reference must be added, here the link file.

Upvotes: 1

Girish Sakhare
Girish Sakhare

Reputation: 763

check if the $ is overridden, search for noConflict in solution and check what character overrides $ and use it. example in my case rather than using $ if i use _$.tmpl() then it works.

Upvotes: 0

Mohammadreza
Mohammadreza

Reputation: 3229

I had enclosed these custom function(belong to working with cookies) to my jquery.js file and it override my $ char. i Comment these lines and error solved 

    (function (factory) {
    if (typeof define === 'function' && define.amd) {
        // amd. register as anonymous module.
        define(['jquery'], factory);
    } else {
        // browser globals.
        factory(jquery);
    }
}

(function ($) {

    var pluses = /\+/g;

    function raw(s) {
        return s;
    }

    function decoded(s) {
        return decodeuricomponent(s.replace(pluses, ' '));
    }

    function converted(s) {
        if (s.indexof('"') === 0) {
            // this is a quoted cookie as according to rfc2068, unescape
            s = s.slice(1, -1).replace(/\\"/g, '"').replace(/\\\\/g, '\\');
        }
        try {
            return config.json ? json.parse(s) : s;
        } catch (er) { }
    }

    var config = $.cookie = function (key, value, options) {

        // write
        if (value !== undefined) {
            options = $.extend({}, config.defaults, options);

            if (typeof options.expires === 'number') {
                var days = options.expires, t = options.expires = new date();
                t.setdate(t.getdate() + days);
            }

            value = config.json ? json.stringify(value) : string(value);

            return (document.cookie = [
                config.raw ? key : encodeuricomponent(key),
                '=',
                config.raw ? value : encodeuricomponent(value),
                options.expires ? '; expires=' + options.expires.toutcstring() : '', // use expires attribute, max-age is not supported by ie
                options.path ? '; path=' + options.path : '',
                options.domain ? '; domain=' + options.domain : '',
                options.secure ? '; secure' : ''
            ].join(''));
        }

        // read
        var decode = config.raw ? raw : decoded;
        var cookies = document.cookie.split('; ');
        var result = key ? undefined : {};
        for (var i = 0, l = cookies.length; i < l; i++) {
            var parts = cookies[i].split('=');
            var name = decode(parts.shift());
            var cookie = decode(parts.join('='));

            if (key && key === name) {
                result = converted(cookie);
                break;
            }

            if (!key) {
                result[name] = converted(cookie);
            }
        }

        return result;
    };

    config.defaults = {};

    $.removecookie = function (key, options) {
        if ($.cookie(key) !== undefined) {
            // must not alter options, thus extending a fresh object...
            $.cookie(key, '', $.extend({}, options, { expires: -1 }));
            return true;
        }
        return false;
    };

}));

Upvotes: 1

Khanh TO
Khanh TO

Reputation: 48972

I suggest you to do 2 checks:

  • Use browser built-in network capture to see if the libraries are loaded properly.
  • Check if another library or script on the page overrides the $ variable.

Upvotes: 2

Related Questions