Экспресс и Джейд: цикл и создание динамических идентификаторов

Question

Экспресс и Джейд: цикл и создание динамических идентификаторов

0

Хорошо, это должен быть простой вопрос на узле.

Используя express, есть один документ под названием app.js, еще один index.jade, еще один index.js и, как правило, другой javascript, скажем server.js, где основная часть работы для сервера выполнена (код здесь может быть внутри app.js, но пусть говорят, что это разные файлы).

Скажем, у меня есть два объекта, подобные этим

myIDs   = ['afoo', 'abar'];
myArray = ['foo', 'bar'];

в server.js, и я хотел бы перебирать их элементы в jade и создавать кнопки, которые имеют значение foo и bar соответственно, а их идентификаторы - afoo и abar соответственно. Как мы можем это сделать?

Более того, можно ли реализовать, если щелчок мыши происходит на одной из этих кнопок? Я попытался дать имя определенной кнопке, которую я создал динамически, используя что-то вроде этого

html = "<button id=\"aUniqueID\">Press me!</button>"
document.getElementById('puff').innerHTML = html;

но, даже если он появляется в браузере, ничего не происходит, когда нажимается кнопка (я отправляю сообщение на сервер, и сервер должен печатать консольный журнал).

Любая помощь будет оценена по достоинству.

MightyMouse 26 сен. 2013, в 03:29

Источник

Теги:

javascript

jquery

node.js

express

pug

1 ответ

Ещё вопросы

drivativ · Accepted Answer · 2013-09-26T00-54-00.000Z

Я рекомендую вам не использовать встроенную функцию, и я бы добавил событие click на стороне клиента, но вы можете добавить его в строку, как обычно, с нефритом

Это предполагает, что значение и идентификатор для каждой кнопки находятся в одной позиции:

myIDs   = ['afoo', 'abar'];
myArray = ['foo', 'bar'];

each button_id, i in myIDs
    button(id="#{button_id}", onclick="yourFunctionHere();") #{myArray[i]}

ОБНОВЛЕНО:

Передача массивов на страницу.jade выглядит так:

app.get('/your-url-path', function(req, res){

    var my_ids_array = ['afoo', 'abar'];
    var my_values_array = ['foo', 'bar'];

    res.render('your-jade-page', { myIDs: my_ids_array, myArray: my_values_array });
});

Спасибо, Дриватив. Я принимаю это, но я думаю, что моя проблема более фундаментальная, потому что я понятия не имею, как передать переменные в index.jade.
Итак, вероятно, в server.js вы отображаете страницу как: res.render ('your-jade-page', {myIDs: [your-array], myArray: [you-array]}), поэтому вы просто генерируете эти массивы и передать их как атрибуты объекта во втором параметре res.render
Я считаю, что вы правы с таким подходом. Тем не менее, способ, которым экспресс генерирует шаблон, эта команда res.render (...) сама по себе находится в другом файле в каталоге маршрутов. Итак, это немного хаотично. В app.js у нас есть выражение вроде: app.get ('/', rout.index); эта индексная функция экспортируется из файла route / index.js, скрипт server.js загружает socket.io и экспортирует функцию инициализации, которая выполняет io = io.listen (server); io.sockets.on («соединение», handleConnection); и, наконец, в app.js после создания сервера вызывается эта функция инициализации
с утверждением вида require ('./ routs / server.js'). initialize (server); где 'сервер' - это переменная, которая была инициализирована с помощью оператора, такого как http.createServer (app) .listen (app.get ('port'), function () {});