将SQL转换为剑道UI Listview



我面临的问题是,我有一个事件列表,这将经常改变,需要在我的剑道UI移动列表视图内更新,每次打开它。SQL表以这种格式存在。

Item        Type                Description
eventID     Integer (Unique)    A unique ID for the event
name        String (30chars)    The name of the event
time        Time Date           A DTG of the event
category    String(enum values) Category for initial disambiguation
subcategory String(enum values) Further disambiguation category
description String (100chars)   The description that appears for the event.
locationID  Integer(Referenced) A unique ID for the location of the event.
pictureID   Integer(Referenced) A ID for the picture file of the event.

我需要把这个SQL数据库变成Listview,所以我做了一个PHP查询,因为我认为这是最好的方法。从那里,我做了一个函数在我的脚本文件,使用这个php文件作为数据源。然后我尝试将它绑定到listview,但失败了。

我的问题是我从这里往哪里走?/谁能告诉我怎么了?/我错过了什么?顺便说一句,我对编码很陌生,这是迄今为止我尝试过的最复杂的事情,所以如果存在的话,请原谅大量的混乱。下面是这三种代码:

<标题> PHP脚本
<?php
    $con = mysql_connect("mysql://serverlURL","USERNAME","PASSWORD");
    if (!$con){ die('Could not connect: '.mysqlerror()); }
    mysql_select_db("DBNAME", $con);
    $q = mysql_query("Select * from events;");
    $res = json_encode(mysql_fetch_assoc($q));
    echo $res;
    mysql_close($con);
?>

我有这是我的main.js:

<标题> JavaScript文件
function dataInit(){
    var eventdata = new kendo.data.Datasource({
        type: "POST",
        contentType: "application/json; charset=utf-8",
        url: "/SQLRequests/getevents.php",
        endlessScroll: true,
        dataType: "json",
        success: function (data) {
            $("#flat-listview").kendoMobileListView({
                dataSource: data.d,
                template: $("#ListViewTemplate").html()
                });
            }
        })
    }

my page然后在header中启动脚本,以及具有listview元素。

<标题> HTML页面
<div data-role="view" data-title="Events" data-style="inset" data-init="datainit">
    <header data-role="header" data-id="default-header">
        <div data-role="navbar">
            <a class="nav-button" data-align="left" data-role="backbutton">Back</a>            
            <span data-role="view-title"></span>
        </div>
    </header>    
    <ul id="eventfeed"></ul>            
</div>

问题是您混合了jQuery ajax方法和数据源。下面是一个关于如何使用数据源做您想做的事情的简单示例:http://jsfiddle.net/whizkid747/rDESU/

在这个示例中,我使用jsFiddle的echo服务返回发送到url的数据。对于你,你只需要提供你的url和做一个"Get"。

像这样:

var dataSource = new kendo.data.DataSource({
    transport: {
        read: {
            url: "/SQLRequests/getevents.php",
            dataType: "json",
            type: "GET",            
        }
    }
});

最新更新