jQuery Templates and jQuery Mobile - More Wally - Wallace B. McClure
in

MoreWally.com

Giving people what they want, More Wally. This is the technical and personal blog site of
Wallace B. (Wally) McClure.

This Blog

Syndication

Technical Sites

Archives

More Wally - Wallace B. McClure

This blog will have all kinds of posts about Wally McClure. In it, there will be tons of .NET and computer programming posts as well as Wally's views on life in general. As you might guess, this site and blog help you get More Wally in your life. What more could anyone want? iPhone, Android, Xamarin.iOS, Xamarin.Android, Mobile, HTML5, .NET, ADO.NET, ASP.NET, AJAX, jQuery, jQuery Mobile, ASP.NET AJAX, and Windows Azure............follow me on twitter at Wally

jQuery Templates and jQuery Mobile

I've been playing with the beta jQuery Templating engine.  I started to play with jQuery Mobile over the weekend.  Basically, I wanted to display information from a web service, put it into a ul/li list and have it display information.  I could call the web service and get data back. Everything was working just fine in that I could get the data back.  Unfortunately, when I bound the data, it just looked like a ul/li list.  I knew I need to do something, but danged if I could figure out what I was doing wrong.  Thankfully, my buddy Dave Ward pointed out what the problem was.  I needed to refresh my listview.  Thanks to Dave, here's the code that I came up with:  The one piece that I was missing was the listview's refresh method.

    <ul id="OptionContainer" data-role="listview" data-theme="a">
       
    </ul>
 
    <script id="userTemplate" type="text/x-jQuery-tmpl">
        <li class="ul-li-icon">
            <a href="">
            <img src="@Href("~")images/users.png" height="30px" />
            ${UserName} ${FirstName} ${MiddleName} ${LastName}
            </a>
        </li>
    </script>
 
    <script language="javascript" type="text/javascript">
        jQuery(function ($) {
            $.ajax({
                type: "POST",
                url: "@Href("~")Services/Users.cshtml",
                dataType: "json",
                contentType: "application/json",
                success: function (outPut) {
                    Users(outPut);
                },
                error: function (xml, err) {
                    alert(xml.responseText);
                    //for(m in xml)
                    //    alert(m);
                    //alert("err:" + err);
                }
            });

        });
        function Users(result){
            $("#userTemplate").tmpl(result).appendTo("#OptionContainer");
            $("#OptionContainer").listview("refresh");
        }

 

Published Dec 15 2010, 01:22 AM by wallym
Filed under: , ,

Comments

 

Twitter Trackbacks for jQuery Templates and jQuery Mobile - More Wally - Wallace B. McClure [morewally.com] on Topsy.com said:

Pingback from  Twitter Trackbacks for                 jQuery Templates and jQuery Mobile - More Wally - Wallace B. McClure         [morewally.com]        on Topsy.com

December 15, 2010 12:19 PM
 

rimonabantexcellence site title said:

Pingback from  rimonabantexcellence site title

May 21, 2013 12:12 PM
 

propecia said:

Pingback from  propecia

May 22, 2013 3:21 PM
2006 - Wallace B. McClure
Powered by Community Server (Non-Commercial Edition), by Telligent Systems