2017-06-25 104 views
0

添加链接最近,我开始一个新的网站有撇号的CMS,并在项目的特点之一将被延长撇号的事件将有谁与每个事件相关的“注册”用户的列表。我能够在撇号事件模块中添加一个新的joinByArray列,并且在编辑事件时它可以正常工作。的按钮操作

现在,我想一个注册按钮添加到撇号事件的页面模块,使用户可以从每个事件的页面注册事件。我现在有一个可用的工作API端点,这是我使用此代码创建:

(在文件lib/modules目录/撇号事件 - 页/ index.js)

module.exports = { 
    construct: function(self, options) { 
     self.route('get', 'register', function(req, res) { 
      // Validate things with the launder module 
      var name = self.apos.launder.string(req.body.name); 
      // Deliver a JSON response 
      return res.send({ status: 'ok', moreInfo: 'something' }); 
     }); 
    } 
}; 

,这个端点按预期工作,但我坚持在前端添加一个带有正确操作链接的按钮。我创建了一个按钮,看起来是正确的show.html覆盖我创建,用下面的代码:

(在lib/modules目录/撇号事件 - 网页/视图/ show.html)

{{ buttons.minor('Register for Field Trip', { action: 'register' }) }} 

我不知道如何添加注册操作的链接。我试图将此代码添加到同一个文件index.js如上:

(在lib/modules目录/撇号事件 - 页/ index.js)

self.registerEvent = function() { 
    var res; 
    self.api('register', {}, function(result) { 
     res = results; 
    }); 
}; 

var superBeforeShow = self.beforeShow; 
self.beforeShow = function(callback) { 
    self.link('register', self.registerEvent); 
    return superBeforeShow(callback); 
}; 

但是,当我访问活动页面,发生错误,说self.link不是一个函数。我应该把链接代码放在其他地方吗?

谢谢!

回答

1

我是P'unk大道的撇号首席建筑师。

首先,您遇到困难是因为您尝试调用模块的index.js文件(即后端node.js代码)中的前端JavaScript API(如link)。

您需要将一个always.js JavaScript文件推送到浏览器。您可以在调用这个你的模块index.js

self.pushAsset('script', 'always', { when: 'always' }); 

然后用您的前端代码填入你的模块的public/js/always.js文件。

二,self.link代码,你很可能看到的是真的只打算的东西是“在上下文中,”比如一个特定的对话框。您正在寻找绑定到具有特定数据属性的按钮上的任何点击。对于这一点,你可以写:

apos.ui.link('register', 'event', function($el, _id) { ... } 

在你always.js,这个代码将与名为register-event的行动来应对任何事情:

{{ buttons.minor('Register for Field Trip', { action: 'register-event' }) }} 

但这仅仅是写了一个方便的方法jQuery委托事件处理程序。你也可以只写:

$('body').on('click', '[data-register-event]', function() { ... }) 

你应该总是包裹你。在DOM就绪功能JS代码:

$(function() { ... }) 

至于调用self.api,这是非常方便的,你可以看看子类apostrophe-context来访问它,但你也可以直接建立自己的URL并且调用我们的从always.jsjsonCall jQuery插件:

$.jsonCall('/modules/your-module-name/register', 
    { ... data ... }, 
    function(result) { ... } 
); 

请查看教程building a contact form,其中包括有关如何从模块的public/js文件夹推送always.js文件作为资产等材料。

该教程还演示了使用自定义撇号小部件类型为您的前端代码提供主页的技术,我通常会推荐这种技术。它使您可以访问self.api等。