Jquery добавление не работает при добавлении формы внутри строки таблицы - PullRequest
Новая
       8

Jquery добавление не работает при добавлении формы внутри строки таблицы

0 голосов
/ 25 февраля 2020

Я пытаюсь добавить динамическую c форму внутри строки таблицы. Ниже приведен мой код. 

$(`#event_draw_table`).append(`
    <tr>
        <form method="post" action="">
            <td><input type="text" name="addmore[0][name]" placeholder="Draw Name" class="form-control" /></td>
            <td><input type="text" name="addmore[0][price]" placeholder="Start" class="form-control" /></td>
            <td><input type="text" name="addmore[0][price]" placeholder="End" class="form-control" /></td>
            <td>
            <button type="submit" name="add" id="save_draw" class="btn btn-sm btn-success">Save</button>
            <button type="button" name="add" id="add" class="btn btn-danger">Remove</button>
            </td>
        </form>
    </tr>
`);

Приведенный выше код работает нормально, и строка таблицы добавляется, но проблема, с которой я сталкиваюсь, заключается в том, что элемент form пуст.

enter image description here

все мои td элементы не заключаются в элемент form . как это исправить?

Ниже мой html код. 

<tbody id="event_draw_table">
     <tr>
        <td><input type="text" name="addmore[0][name]" placeholder="Draw Name" class="form-control" /></td>
        <td><input type="text" name="addmore[0][price]" placeholder="Start" class="form-control" /></td>
        <td><input type="text" name="addmore[0][price]" placeholder="End" class="form-control" /></td>
        <td>
           <button type="submit" name="add" id="save_draw" class="btn btn-sm btn-success">Save</button>
           <button type="button" name="add" id="remove_draw" class="btn btn-sm btn-danger">Remove</button>
        </td>
     </tr>  
  </tbody>

1 Ответ

0 голосов
/ 25 февраля 2020

Создайте форму и присвойте ей идентификатор form id="form1", затем назначьте форму каждому входу и кнопке внутри строки form="form1". Не забудьте дать другим строкам разные идентификаторы формы, если вы будете добавлять несколько строк. 

$('#event_draw_table').append('
    <tr>
        <form id="form1" method="post" action=""></form>
        <td><input form="form1" type="text" name="addmore[0][name]" placeholder="Draw Name" class="form-control" /></td>
        <td><input form="form1" type="text" name="addmore[0][price]" placeholder="Start" class="form-control" /></td>
        <td><input form="form1" type="text" name="addmore[0][price]" placeholder="End" class="form-control" /></td>
        <td>
            <button type="submit" form="form1" name="add" id="save_draw" class="btn btn-sm btn-success">Save</button>
            <button type="button" form="form1" name="add" id="add" class="btn btn-danger">Remove</button>
        </td>
    </tr>
');
...