Search code examples
jqueryasp.netjquery-templates

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


Solution

  • 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.