1

私は剣道に不慣れで、問題にぶつかりました。剣道アプリでリモートjsonを実行し、それをテンプレート/リストビューに追加しようとしています。chrome dev toolsの[ネットワーク]タブとconsole.log（this.view（））;で応答を確認できます。データソースの変更メソッドで、コンソールに結果を含むある種の剣道コードを取得します

ScreenShotを参照してください

しかし、結果をテンプレートに追加できないようです。ここに私のコードがあります。私が剣道を愛しているので、あなたが私を正しい方向に向けることができるといいのですが、前進するにはこれを解決する必要があります...またはjquerymobileに戻ります。前もって感謝します。

<body onload="onBodyLoad()">

<!-- Home page -->
<div data-role="view" data-layout="default" id="home">
    <p>Home</p>
</div>

<div data-role="view" data-layout="default" id="search">
    <div class="form">
        <button id="getProperties" name="getProperties" value="Get Properties" data-role="button">Get Properies</button>
    </div>
    <ul id="resultListView"/>
</div>

<!-- Settings -->
<div data-role="view" data-layout="default" id="settings">
    <p>Some settings</p>
</div>

<!-- Layout -->
<section data-role="layout" data-id="default">
    <header data-role="header">
        <div data-role="navbar">My app</div>
    </header>
    <!--View content will render here-->
    <footer data-role="footer">
        <div data-role="tabstrip">
            <a data-icon="home" href="#home">Home</a>
            <a data-icon="search" href="#search">Search</a>
            <a data-icon="organize" href="#calculator">Calculator</a>
            <a data-icon="settings" href="#settings">Settings</a>       
        </div> 
    </footer>
</section>

<script src="js/jquery.min.js"></script>
<script src="js/kendo.all.min.js"></script>

<!-- Template for Property results, need to change below fields -->
<script type="text/x-kendo-template" id="propertiesListViewTemplate">
    <h4>${property_type}</h4>
    <p>${street_name}</p>
</script>

<script>
var app = new kendo.mobile.Application(document.body, 
{
    transition:'slide'
});

function onBodyLoad() {
    getProperties(onResult);
}

function getProperties(callback) {

    var template = kendo.template($("#propertiesListViewTemplate").html());

    var dataSource = new kendo.data.DataSource({
        transport: {
            read: {
                url: 'http://www.someurl.me/getproperties.php?postcode=hx59ay',
                dataType: "jsonp"
            }
        },

        schema: {
            data: "listing"
        },


        error: function(e) {
            console.log("Error " + e);
        },
        change: function() {
            $("#propertyResultListView").html(kendo.render(template, this.view()));
            console.log(this.view());
        }
    });
    dataSource.read();
    $("#propertyResultListView").kendoMobileListView({dataSource:dataSource,template: $("#propertiesListViewTemplate").html()});

}

function onResult(resultData) {
    console.log("Results " + listing); // This isnt getting logged in console...
    $("#propertyResultListView").kendoMobileListView({dataSource: kendo.data.DataSource.create({data:resultData}),
        template: $("#propertiesListViewTemplate").html()});
}

</script>
4

1 に答える 1

2

いくつかのこと：

  • id = "propertyResultListView"の要素はありませんが、それを使用してリストビューを作成します。
  • 剣道ウィジェットでデータソースを使用する場合は、それを指定する以外に何もする必要はありません。たとえば、変更イベントを手動で処理したり、テンプレートをレンダリングしたりする必要はありません。モバイルリストビューで自動的に処理されます。

詳細については、リストビューのドキュメントをご覧ください。また、役立つ可能性のあるいくつかのデモがあります：http ://demos.kendoui.c​​om/mobile/listview/databinding.html

于 2012-12-03T07:07:59.910 に答える