jQuery templates

jQuery templates is a useful plugin developed by Microsofts's ASP.NET team in collaboration with jquery open source team. Templates helps you to manipulate the data at client side and display in browser. It is more useful to display the dataset that is fetched from database using client side Asynch Ajax call.

jQuery Template example

In order to use jQuery templates we either need to download "jquery.tmpl.js" plugin and add reference or we can also refer it from cdn.
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
     <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
     <script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery.templates/beta1/jquery.tmpl.js"></script>
  <script type="text/javascript">

      $(document).ready(function () {
          debugger;
          var loc = window.location.href;
          $.ajax({
              type: 'POST',
              url: loc + "/GetBookList",
              data: "{}",
              contentType: "application/json; charset=utf-8"

          })
        .success(function (response) {
            debugger;
            $("#bookCollection").tmpl(response.d).appendTo(".book-container");
        })
        .error(function (response) {
            alert(response.d);
        });

      });
  </script>
</head>
<body>
    <form id="form1" runat="server">
    <div class="book-container">
    
    </div>
     <script id="bookCollection" type="text/x-jQuery-tmpl">
        <div>
           <h2>${Title}</h2>
            Author: ${Author}
            price: ${Price}
        </div>
    </script>
    </form>
</body>
</html>
Here in above code below script is template to which we are going to bind the data. <script id="bookCollection" type="text/x-jQuery-tmpl"> <div> <h2>${Title}</h2> Author: ${Author} price: ${Price} </div> </script> And by using $("#bookCollection").tmpl(response.d).appendTo(".book-container"); we actually bind the data to the template and append that template to some fixed html like div.


Below code is for reference to get data from code behind method:


 [WebMethod]
        public static List GetBookList()
        {

            return new List()
                       {
                           new Book {Title = "ASP.NET", Author = "Stephen", Price = 350.9},
                           new Book {Title = "WPF", Author = "Murli", Price = 400},
                           new Book {Title = "WCF", Author = "Avinash", Price = 350}
                       };
        }
Refer link to know how to make a ajax call to code behind.


Dynamic in C# 4.0

Dynamic type is introduced C# 4.0. As its name specifies type of the defined variable is decided dynamically at runtime. At compile time the variable that is declared as dynamic is assumed to be support any type or operation. As it does everything at runtime if code is not valid then errors are caught at runtime. Two major disadvantages of dynamic type are No compile time checking and No intelliSense support

Dynamic type example

Suppose we have class called SomeClass that have methods Method1() and Sum(intx, int y).
    public class SomeClass
    {
        public SomeClass()
        {
        }

        public void Method1()
        {
            //Do something
        }

        public int Sum(int x, int y)
        {
            return x + y;
        }
    }

and we are now trying to use the above class using dynamic type.
    public partial class DynamicType : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            dynamic someclass_dy = new SomeClass();
           
            someclass_dy.Method1();

            someclass_dy.Sum(10, 3);

            someclass_dy.SomeOtherMethod();
        }
     }

In above code we have defined dynamic type object of class SomeClass(). and now if you try to access methods from that class it will not show any method in intelliSense, you explicitly need to know the class methods and call them that is because dynamic type does not supports compile time checking. If you notice there is code line someclass_dy.SomeOtherMethod(); where SomeOtherMethod() does not exists in SomeClass() still it will not throw any compile time error, but it will throw runtime error.