Presenting AJAX Client Templates from ASP.NET v4 Preview

January 15, 2009 by

Tonight (Jan 13, 2008 5:30-8pm) at the Arizona.net User Group, I’ll be presenting AJAX client templates currently available in the ASP.NET v4 Preview hosted on CodePlex.

Below is a quick code sample to wet your appetite.

C# / Service – Not really relevant to the call, but it’s where the data comes from

   1: [WebMethod]
   2: public List<Product> GetProducts()
   3: {
   4:     return GetProductsByOrderId(0);;
   5: }
   6:  
   7: [WebMethod]
   8: public List<Product> GetProductsByOrderId(int orderId)
   9: {
  10:     var productList = new List<Product>();
  11:     using (var adapter = new ProductsTableAdapter())
  12:     {
  13:         Northwind.ProductsDataTable products = null;
  14:         products = orderId > 0 ? adapter.GetDataByProductId(orderId) : adapter.GetData();
  15:         
  16:         foreach (var row in products)
  17:         {
  18:             productList.Add(new Product() { 
  19:                 Name = row["ProductName"].ToString(), 
  20:                 Id = (int) row["ProductId"]
  21:             });
  22:         }
  23:     }
  24:     return productList;
  25: }

ASPX Page

   1: <%@ Page Title="" Language="C#" MasterPageFile="~/Common/WebSiteMaster.master" AutoEventWireup="true" CodeBehind="A_Templates.aspx.cs" Inherits="ScottCateAjax2008.Lesson10.A_Templates" %>  
   2: <asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">  
   3:   
   4: <asp:ScriptManager id="SM1" runat="server">  
   5:     <Scripts>  
   6:         <asp:ScriptReference ScriptMode="Debug" Path="~/Common/Scripts/ASPNET4Preview3/MicrosoftAjaxTemplates.js"  />  
   7:         <asp:ScriptReference Path="~/Lesson10/A_Templates.aspx.js" />  
   8:     </Scripts>  
   9:     <Services>  
  10:         <asp:ServiceReference Path="~/Services/NorthwindService.asmx" />  
  11:     </Services>  
  12: </asp:ScriptManager>  
  13:     
  14:     <h1>ASP.NET 4.0 - Templates</h1>  
  15:   
  16:     <table id="products" border="1" class="sys-template">  
  17:         <tr>  
  18:             <td>{{ Id }}</td>  
  19:             <td>{{ Name }}</td>  
  20:         </tr>  
  21:     </table>  
  22:   
  23: </asp:Content>

JavaScript

   1: function pageLoad() {   
   2:     ScottCateAjax2008.Services.NorthwindService.GetProducts(goGetProducts_Callback, errorCallback);   
   3: }   
   4:   
   5: function goGetProducts_Callback(results) {   
   6:     var products = $create(Sys.UI.DataView, {}, {}, {}, $get("products"));   
   7:     products.set_data(results);   
   8: }   
   9:        
  10: function errorCallback(error) {   
  11:     alert(error);   
  12: }

Outcome

imageArizona.net User Group, I’ll be presenting AJAX client templates currently available in the ASP.NET v4 Preview hosted on CodePlex.

Below is a quick code sample to wet your appetite.

C# / Service – Not really relevant to the call, but it’s where the data comes from

   1: [WebMethod]
   2: public List<Product> GetProducts()
   3: {
   4:     return GetProductsByOrderId(0);;
   5: }
   6:  
   7: [WebMethod]
   8: public List<Product> GetProductsByOrderId(int orderId)
   9: {
  10:     var productList = new List<Product>();
  11:     using (var adapter = new ProductsTableAdapter())
  12:     {
  13:         Northwind.ProductsDataTable products = null;
  14:         products = orderId > 0 ? adapter.GetDataByProductId(orderId) : adapter.GetData();
  15:         
  16:         foreach (var row in products)
  17:         {
  18:             productList.Add(new Product() { 
  19:                 Name = row["ProductName"].ToString(), 
  20:                 Id = (int) row["ProductId"]
  21:             });
  22:         }
  23:     }
  24:     return productList;
  25: }

ASPX Page

   1: <%@ Page Title="" Language="C#" MasterPageFile="~/Common/WebSiteMaster.master" AutoEventWireup="true" CodeBehind="A_Templates.aspx.cs" Inherits="ScottCateAjax2008.Lesson10.A_Templates" %>  
   2: <asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">  
   3:   
   4: <asp:ScriptManager id="SM1" runat="server">  
   5:     <Scripts>  
   6:         <asp:ScriptReference ScriptMode="Debug" Path="~/Common/Scripts/ASPNET4Preview3/MicrosoftAjaxTemplates.js"  />  
   7:         <asp:ScriptReference Path="~/Lesson10/A_Templates.aspx.js" />  
   8:     </Scripts>  
   9:     <Services>  
  10:         <asp:ServiceReference Path="~/Services/NorthwindService.asmx" />  
  11:     </Services>  
  12: </asp:ScriptManager>  
  13:     
  14:     <h1>ASP.NET 4.0 - Templates</h1>  
  15:   
  16:     <table id="products" border="1" class="sys-template">  
  17:         <tr>  
  18:             <td>{{ Id }}</td>  
  19:             <td>{{ Name }}</td>  
  20:         </tr>  
  21:     </table>  
  22:   
  23: </asp:Content>

JavaScript

   1: function pageLoad() {   
   2:     ScottCateAjax2008.Services.NorthwindService.GetProducts(goGetProducts_Callback, errorCallback);   
   3: }   
   4:   
   5: function goGetProducts_Callback(results) {   
   6:     var products = $create(Sys.UI.DataView, {}, {}, {}, $get("products"));   
   7:     products.set_data(results);   
   8: }   
   9:        
  10: function errorCallback(error) {   
  11:     alert(error);   
  12: }

Outcome

image

” width=”467″ border=”0″ />

Filed Under: Technology

GraffitiCMS Tip – Sorting Posts in a Category

January 10, 2009 by

I’m not sure if this is the only way – but I just figured out that Posts are displayed by a published date, which is not necessarily the order you enter them.

If you’re posts aren’t in the order you want them – look into modifying the published date.

Filed Under: Technology

https://scottcate.com/wp-content/uploads/2012/11/sc1.png

January 9, 2009 by

Thanks to a new Mobile theme, and a Mobile Theme selector from the GraffitiCMS Extras project on CodePlex, you should be able to hit this site, and read it pretty easily on your mobile device.

This is helpful, because I commonly post links back to the site from twitter, which you may be reading on your mobile phone.

Filed Under: Technology

Microsoft Tag for ScottCate.com

January 9, 2009 by

Microsoft Tag for ScottCate.com At conferences I’m always giving out my blog URL. With this image I can simply display my blog, and anyone with Microsoft Tag installed on a smart client, can point and browse 🙂

Now that my blog is mobile enabled, this will be much more common.

What is Microsoft Tag? (Direct Mobile Download Link: Click Here)

I just saw it today from a twitter post by @CalebKenkins. The short version is … what you see is a bar code. Instead of nice tidy black and white lines, or a burst of dots (like the shipper barcodes) these are colors. The big difference is distance and focus.

Let me backup. The idea is … you point your phone camera (or any Tag enabled camera) at this image. Because it’s big, and easy to read, the image could be on anything. Like a billboard, or a sign at the mall, or next to artwork at a museum (all examples on the site).

imageI thought it would be a nice way to let audience members navigate to my blog. I’m sure there are millions of uses for this, and I hope it catches on.

After all – it’s much easier to point-and-browse, than it is to open up a mobile device and key in a web address.

You can read more information on the Microsoft Tag website.

UPDATE: Microsoft Tag comes with reporting

After using this for a few minutes, the story improves. When a tag is scanned, it has to be looked up in a database. This gives the opportunity to log a “hit count”. I think this changes the print media game, where historically it has been close to impossible to know if people have any interest in your print ad. Click this thumbnail for a quick sample report.

Filed Under: Technology

Moving ScottCate.com to GraffitiCMS

January 8, 2009 by

I started VSTricks.com as a community new years resolution last week. To get started, I wanted something that was easy and fast to setup on my own servers, and I decided to check out all the hype around GraffitiCMS.

After a week of using the software, I’m extremely happy with it, and I’ve decided to transform the VSTricks.com project into a blog upgrade for ScottCate.com

Both URL’s still point to the same place, and the FeedBurner feeds still bring the same content. In fact a nice benefit of FeedBurner is that the original content feed can change, and the consumer doesn’t have to know about it (unless you read it in a post like this). FeedBurner is cool like that.

You may have been following my original blog feed at http://Weblogs.ASP.net/ScottCate and I will maintain that blog for technical posts. On the left of this site, you’ll see three FeedBurner feeds.

Filed Under: Technology
« Previous Page
Next Page »