Я пытаюсь создать динамический выпадающий список с возможностью перенаправления на другую страницу, если вы нажмете «просмотреть».
Я смог сделать это с помощью HTML, который перенаправлялся на новую html-страницу в зависимости от выбранной опции:
<td><select name="viewpo" id="viewpo" onchange="window.location.href=this.value">
<option>Edit</option>
<option value="viewpo.html">View</option>
<option value="holdpo.html">On Hold</option>
</select>
</select></td>
Однако, поскольку я решил использовать партиалы Handlebars, я понял, что могуне кодируйте вышеуказанный HTML-код, поскольку ссылки зависят от отображаемой страницы.IE Если это страница сотрудников, она будет перенаправлена на страницу просмотра сотрудников.Если это страница заказа на поставку, она будет перенаправлена на страницу просмотра сотрудников.
Я решил сделать мои рули частичными, как это:
<table class="table table-striped employee ">
<thead>
<div class="row">
<tr class="headerrow">
</div>
{{#each tableColumns as |column|}}
<th>{{column.value}}</th>
{{/each}}
</tr>
</thead>
<tbody>
{{#each tableData as |row|}}
<tr>
{{#../tableColumns as |col|}}
<td>
{{#if col.editable}}
<select id="myList" name="myList" onchange="window.location.href=this.value">
<option>Edit</option>
{{#if active.employees}}
<option value="../viewemployees">View</option>
{{/if}}
{{#if active.PO}}
<option value="../viewPO">View</option>
{{/if}}
<option>Delete</option>
</select>
{{else}}
{{lookup row col.name}}
{{/if}}
</td>
{{/../tableColumns}}
</tr>
{{/each}}
</tbody>
</table>
Моя цель - получить ссылку на просмотр вчастичное изменение ссылки в зависимости от того, какая страница активна.HTML-код, приведенный выше, работает (но нужен динамический, а не жесткое кодирование для каждого экрана), но когда я включаю #if в частичную, всякий раз, когда я нажимаю на просмотр, он ничего не делает.
Index.js
app.engine('handlebars', exphbs({defaultLayout: 'main'}));
app.set('view engine', 'handlebars');
app.use('/static', express.static('public'));
app.get('/', (req, res) => {
res.render('employees', { active: {employees: true}, data: employeeData, columns: employeeColumns, pageHeader: "Employees"});
});
app.get('/po', (req, res) => {
res.render('po', { active: {PO: true}, data: poData, columns: poColumns, pageHeader: "Purchase Orders"});
});