0

我正在使用带有 MySQL 后端的 slim、backbone.js 和 jquery mobile 开发一个应用程序。

工作流程大致如下:

1) 搜索一个 uni 模块。2) 列出匹配的模块。3) 选择并查看模块详情页面。4) 列出与该模块相关的讲师。5) 选择并查看讲师。

我完成了第 1 步到第 4 步,但无法显示讲师详细信息页面。我想我可能将 id 传递给 API 调用错误,或者我的路由搞砸了。

在我的 index.php 中,我有一个 API 调用列表:

$app = new Slim();

$app->get('/modules', 'getModules'); $app->get('/modules/:id', 'getModule'); $app->get('/modules/search/:query', 'getModulesByName'); $app->get('/modules/:id/students', 'getStudents'); $app->get('/modules/:id/lecturers', 'getLecturers'); $app->get('/modules/lecturers/:id/lecturer', 'getLecturer');

最后两个涉及拉取与模块关联的讲师列表,然后在您点击他们时拉出单个讲师,显示详细信息。

getLecturers 有效,在这里供参考:

function getLecturers($id) { $sql = "select l.staffNumber, l.firstName, l.lastName, l.moduleNo1, l.moduleNo2, l.email, m.moduleNo from Lecturertable l, moduletable m where m.moduleNo= :id AND (l.moduleNo1=:id OR l.moduleNo2=:id)";

try {
    $db = getConnection();
    $stmt = $db->prepare($sql);
    $stmt->bindParam("id", $id);
    $stmt->execute();
    $lecturer = $stmt->fetchAll(PDO::FETCH_OBJ);
    $db = null;

    if (!isset($_GET['callback'])) {
        echo json_encode($lecturer);
    } else {
        echo $_GET['callback'] . '(' . json_encode($lecturer) . ');';
    }

} catch(PDOException $e) {
    echo '{"error":{"text":'. $e->getMessage() .'}}';
} }

getLecturer(单人)在这里:

function getLecturer($id) { $sql = "select l.staffNumber, l.firstName, l.lastName, l.moduleNo1, l.moduleNo2, l.email from Lecturertable l where l.staffNumber=:id";

try {
    $db = getConnection();
    $stmt = $db->prepare($sql);
    $stmt->bindParam("id", $id);
    $stmt->execute();
    $lecturer = $stmt->fetchObject();
    $db = null;

    if (!isset($_GET['callback'])) {
        echo json_encode($lecturer);
    } else {
        echo $_GET['callback'] . '(' . json_encode($lecturer) . ');';
    }

} catch(PDOException $e) {
    echo '{"error":{"text":'. $e->getMessage() .'}}';
} }

这是我在 main.js 中的路线:

var AppRouter = Backbone.Router.extend({

routes:{
    "":"list",
    "list":"list",
    "modules/:id":"moduleDetails",
    "modules/:id/students":"moduleStudents",
    "modules/:id/lecturers":"moduleLecturers",
    "modules/:id/lecturers/:id/lecturer":"lecturerDetails"
},

以及匹配模块Lecturers 和lecturerDetails 函数:

moduleLecturers:function (id) { var module = new Module({id:id}); 模块.讲师.fetch(); this.changePage(new ModuleLecturersPage({model:module.lectures})); },

lecturerDetails:function (id) {
    var lecturer = new Lecturer({id:id});
    var self = this;
    module.lecturers.lecturer.fetch({
        success:function (data) {
            self.changePage(new LecturerView({model:data}));
        }
    });
},

然后我有 Lecturers 和 Lecturer 模型,以及 Lecturers 集合:

window.Lecturers = Backbone.Model.extend({

urlRoot:"../api/lecturers",

initialize:function () {
    this.lecturers = new lecturersCollection();
    this.lecturers.url = '../api/modules/' + this.id + '/lecturers';
}

});

window.lecturesCollection = Backbone.Collection.extend({

model:Lecturers,

url:"../api/lecturers",

});

//新的

window.Lecturer = Backbone.Model.extend({

urlRoot:"../api/lecturer",

});

以及指向“讲师详细信息”html模板的讲师视图,该模板未显示:

window.LecturerView = Backbone.View.extend({

initialize:function () {
    this.template = _.template(tpl.get('lecturer-details'));
},

render:function (eventName) {
    $(this.el).html(this.template(this.model.toJSON()));
    return this;
}

});

讲师列表项,当点击时应显示详细视图,包含一个链接:href='#modules/<%= moduleNo %>/#leturers/<%= staffNumber %>'

尽管 URL 在浏览器中似乎是正确的 (...jquerymobile/#modules/999003/#lecturers/123001),但讲师详细信息页面并未显示。

几天来我一直在用这个打破我的头 - 如果有人能发现任何不合适的地方,我将不胜感激!

4

1 回答 1

1

您不能使用双标签,只需修复您的链接:

你有:

href='#modules/<%= moduleNo %>/#lecturers/<%= staffNumber %>'

权利必须是:

href='#modules/<%= moduleNo %>/lecturers/<%= staffNumber %>'
于 2013-04-06T19:37:16.657 回答