Kendo UI

jQuery + Kendo UI + MockJax

HTML

<link rel="stylesheet" href="http://cdn.kendostatic.com/2011.3.1007/styles/kendo.common.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2011.3.1007/styles/kendo.blueopal.min.css">
<script src="http://cdn.kendostatic.com/2011.3.1007/js/kendo.all.min.js"></script>
<script src="https://raw.github.com/appendto/jquery-mockjax/master/jquery.mockjax.js"></script>
<script src="https://getfirebug.com/firebug-lite.js"></script>

<ul id="weather-container">

</ul>

<script id="dashwidget-weather-template" type="text/x-kendo-template">
    #= condition # : #= temp_c #
</script>

JavaScript

function onChange() {
    alert("Changed");
    $("#weather-container").html(kendo.render(template, this.view()));
}

var template = kendo.template($("#dashwidget-weather-template").html());

var dataSource = new kendo.data.DataSource({
    transport: {
        read: {
            url: "http://www.google.com/ig/api",
            dateType: "xml",
            data: {
                weather: "Hamilton,ON"
            }

        }
    },
    schema: {
        type: "xml",
        data: "/weather/current_conditions",
        model: {
            fields: {
                condition: "condition/text()",
                temp: "temp_c/text()"
            }
        }
    },
    change: onChange
});

dataSource.read();