Динамическая кнопка в ejs для заполнения поля формы

В настоящее время я использую NodeJS с шаблонами ejs и базой данных mySQL. Я создал ejs, который может динамически печатать таблицу, представляющую таблицу в базе данных:

Код выглядит так:

<% for(var i=0; i<info.length; i++) {%>
        <tr>
                <td><b><%= info[i].id %></b></td>

                <td><%= sinfo[i].path %></td>                       
        </tr>
<% } %>

Это работает нормально.

Где-то в том же ejs можно найти форму с полем ввода.

Выглядит так:

<input type = "text" name = "id" placeholder = "id input"required>

Теперь я хочу создать кнопку в каждой строке таблицы. При нажатии кнопки идентификатор из столбца, в котором находится кнопка, должен быть заполнен в моем поле формы. Таким образом, в каждой строке будет одна кнопка!

Я не могу найти способ сделать это.

Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
0
0
1 409
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Это должно работать:

<% for(var i=0; i<info.length; i++) {%>
        <tr>
                <td><b><%= info[i].id %></b></td>
                <td><%= info[i].path %></td>
                <td><input type = "button" onclick = "document.getElementById('myText').value='<%= info[i].id %>'" value = "Click" /></td>             
        </tr>
<% } %>

Затем установите идентификатор myText для вашего входного текста:

<input type = "text" name = "id" id = "myText" placeholder = "id input">

Более чистое решение - создать функцию где-нибудь в вашем коде javascript:

function onClick(id){
  document.getElementById('myText').value=id;
}

И поэтому ваш код ejs будет:

<% for(var i=0; i<info.length; i++) {%>
        <tr>
                <td><b><%= info[i].id %></b></td>
                <td><%= info[i].path %></td>
                <td><input type = "button" onclick = "onClick('<%= info[i].id %>')" value = "Click" /></td>             
        </tr>
<% } %>

Другие вопросы по теме