Функция Javascript onClick с HTML-таблицей включает в себя FORM - PullRequest
0 голосов
/ 12 ноября 2018

Мне нужно добавить форму ввода в ячейку таблицы.
Это просто в использовании table, но я запутался в использовании Javascript с table.

Есть какие-нибудь советы или помощь?

Ниже мой код:

<a onClick="newRow()" class="btn btn-primary text-light">Add New</a>

<script>

function newRow(){
var table = document.getElementById("tb_deviceDetail");
var row = table.insertRow(0);
var cell1 = row.insertCell(0);
var cell2 = row.insertCell(1);
cell1.innerHTML = "PLACE FOR INPUT FORM";
cell2.innerHTML = "PLACE FOR INPUT FORM";   
}

</script>

Код формы ввода: input type="text" name="input01", но эта форма ввода должна быть POST для любой страницы с PHP.Так что ему нужно form method="post" action="#" перед input.Но с JAVASCRIPT я не могу реализовать свою идею.

Функция onClick используется для добавления формы ввода с именем = "xxx"

Примечание: I 'Я младший кодер ... пожалуйста, помогите мне!

1 Ответ

0 голосов
/ 12 ноября 2018

Я думаю, вам нужно что-то вроде этого, я динамически генерирую входные данные при щелчке и присваиваю его имя (name1, name2, name3 ...) переменной счетчика.

и размещение его в обычном режиме с использованием HTML-формы.

let counter = 0;

    function newRow()
    {
    var table = document.getElementById("tb_deviceDetail");
    var row = table.insertRow(0);
    var cell1 = row.insertCell(0);
    var cell2 = row.insertCell(1);
    cell1.innerHTML = `<input type="text" name="input${++counter}">`;
    cell2.innerHTML = `<input type="text" name="input${++counter}">`;   
    }
<!DOCTYPE html>
<html>
<head>
</head>
<body>
    
    <a onClick="newRow()" class="btn btn-primary text-light">Add New</a>

    <form action="#" method="POST" >

        <table id="tb_deviceDetail">
        </table>

        <input type="submit" name="submit">

    </form>

    <script src="main.js"></script>
</body>
</html>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...