If you’re new to using jQuery with ASP.NET, go through this list of posts: http://encosia.com/jquery-for-the-asp-net-developer/

You should still be able to get this into the client-side data. Either try to pull it into your products collection, or render that collection into the page as JSON and then merge it into “products” before rendering the jTemplates template.

Consider the stripped down version of jTemplates below:

<script type="text/html" id="ContentTemplates">
        {#template MAIN}
            {#foreach $T.Products as product}
                <div id="div-product-{$T.product.Id}" class="product-wrapper">
                    {#include Content root=$T.product}
                </div>
            {#/for}
        {#/template MAIN}
 
        {#template Content}
            <div class="view-container">
		<p>Id: {$T.Id}</p>
		<p>Desc: {$T.Desc}</p>
		<p>Vendor Id: {$T.VendorId}</p>
 
		<!-- Vendor name doesn't supplied by the web service, it needs to be resolved using ASP.NET server code
		<p>Vendor Name: <%= GetVendorName({$T.VendorId}) %></p>
		i was hoping to do something like this, but apparently it wouldn't work this way -->
            </div>
        {#/template Content}
</script>

Now i’m banging my head on the wall for failing to achieve something as easy as this.. is it something that I’ve missed? or is it that jTemplates really should be used to render simple HTML layout only? Is the template engine capable of resolving server code blocks? Or am I simply just DOOMED?

I’m already started to convert my code from client-side to server-side now. Nonetheless, I hope there’s good news from you, bcoz I really like to stick with current design and I think they’re just COOL!

<pre lang="
<div class="repFocus float_left ">
<div class="repImgContainer float_left">
<asp:Image ID="Image1" ImageUrl='<%# Product.ImagePath %>' runat="server" Height="<%# Product.GetHeightByImageSize(EnumImageSize.Thumbnail, MaxImageHeight) %>"
Width="<%# Product.GetConstrainedWidthByImageSize(EnumImageSize.Thumbnail, MaxImageHeight) %>" />
</div>
<div class="repTxtContainer float_right">

<ul>
<li>
<asp:Label ID="nameLabel" CssClass="repName" runat="server" Text="<%# Product.Name %>" />
</li>
<li>
<asp:Label ID="Label2" CssClass="replabelTxt" runat="server" Text="From "></asp:Label>
<asp:Label ID="priceLabel" CssClass="repPrice" runat="server" Text='<%# String.Format("£{0:f2}", Product.Price) %>' /></li>
<li>
<asp:Label ID="sizeLabel" CssClass="repSize" runat="server" Text="<%# Product.Size %>" />
<asp:Label ID="Label1" runat="server" CssClass="replabelTxt" Text=" and Up"></asp:Label></li>

</ul>

</div>
</div>
</div>
">code

If I manage to get my head around to using your approach it will be great in the long run.
Thanks!

I am working with jquery and .net in scenarios similar to this example.. in my local development computer all works fine.. but when i pusblish to the production web server the ajax doesn’t work.. always get the error: 200 OK… reading the documentation talks about of Cross domain policy… but i dont call mathods out of domain… like this sample i call a method in my own aspx page…. So i dont understand the problem….

Do you know why i present this behavior?

Note: If i use cross domain calls the solcution is use jsonp or other weird things… but i dont want use this tecniques because is simple that i want to do…. :(

For some reason I can’t get it to work on my Firefox4. It doesn’t load the table, how do i backtrace to the error? no error are shown on my firebug, and it works great on my chrome