如何使用Knockout和Upshot数据绑定JQuery Mobile

时间:2012-03-23 14:29:02

标签: jquery-mobile knockout.js upshot

我正在尝试构建一个JQuery Mobile UI,它使用upshot从服务获取数据,然后使用Knockout.js将值绑定到列表。我能够填充数据,但是JQuery移动样式没有被渲染。

这是我的代码。在这方面的任何帮助将非常感激。

<h2>Projects (<span data-bind="text: projects().length"></span>)</h2>

<ul data-inset="true" data-bind="foreach: projects" data-role="listview" data-theme="e" data-dividertheme="c" data-filter="true"> 
    <li>
            <a href="#" data-bind="text: ProjectName"></a>
            Project Type : <label data-bind="text: ProjectType"></label>
            Description : <label data-bind="text: Description"></label>
    </li> 
</ul>       
<p></p>

@(Html.UpshotContext(bufferChanges: true).DataSource<ProjectServiceController>(x => x.GetProjects()))

<script type="text/javascript">
    $(function () {
        var dataSource = upshot.dataSources.Projects.refresh();
        var ProjectsViewModel = {
            projects: dataSource.getEntities()
        };

        ko.applyBindings(ProjectsViewModel);        
    });

</script>

1 个答案:

答案 0 :(得分:0)

refresh()调用是异步的,因此您可以提供在刷新后执行的回调函数。 jQueryMobile文档说如果你添加项目,你需要在创建项目后刷新listview:http://jquerymobile.com/demos/1.0.1/docs/lists/docs-lists.html

以下是您可能会如何做到这一点的示例:

var dataSource = upshot.dataSources.Projects.refresh(function() {
    $("ul").listview('refresh');
});