<body>
<div id="wrapper">
<!-- Page Content -->
<div id="page-content-wrapper">
<div class="container-fluid">
<div class="row">
<div class="col-lg-12">
<h1 align="center">Controls Page</h1>
</br>
<main>
<section id="with-container-example">
<!-- table -->
<div class="container">
<div class="row">
<div class="table-responsive">
<!-- Table Titles -->
<table class="table table-hover">
<thead>
<tr class="alert-info">
<!-- <button type="button" class="btn" onclick="alert('All information saved!')">Save All</button><br></br> -->
<input type="button" class="btn" value="Save" style="float: right;" onclick="alert('All information saved!')"><br></br>
<th>TEXT:</th>
<th>~</th>
<th>~</th>
<th>DROPDOWN</th>
<th>DROPDOWN</th>
<th>TEXT:</th>
<th>TEXT:</th>
<th>TEXT:</th>
<th> ADD CELL(+)
</>
</tr>
</thead>
<!-- Tables -->
<tbody id="myTable">
<tr>
<td>A65.1</td>
<td>Table Cell</td>
<td>Control <br> Conflictin duties and area of responsibilities .......</td>
<td align="center">
<select id="selectbasic" name="selectbasic" class="selectpicker">
<option>-</option>
<option>Yes</option>
<option>No</option>
</select>
</td>
<td align="center">
<select id="selectbasic" name="selectbasic" class="selectpicker">
<option>-</option>
<option>Yes</option>
<option>No</option>
<option>Partially</option>
</select>
</td>
<td>Table cell</td>
<td>Table cell</td>
<td>Table cell</td>
</tr>
<tr>
<td>2</td>
<td>Table cell</td>
<td>Control <br><textarea rows="3" cols="60">Conflictin duties and area of responsibilities .......
</textarea></td>
<td align="center">
<select id="selectbasic" name="selectbasic" class="selectpicker">
<option>-</option>
<option>Yes</option>
<option>No</option>
</select>
<td align="center">
<select id="selectbasic" name="selectbasic" class="selectpicker">
<option>-</option>
<option>Yes</option>
<option>No</option>
<option>Partially</option>
</select>
</td>
<td>Table cell</td>
<td>Table cell</td>
<td>Table cell</td>
</tr>
<tr>
<td>3</td>
<td>Table cell</td>
<td>Table cell</td>
<td align="center">
<select id="selectbasic" name="selectbasic" class="selectpicker">
<option>-</option>
<option>Yes</option>
<option>No</option>
</select>
<td align="center">
<select id="selectbasic" name="selectbasic" class="selectpicker">
<option>-</option>
<option>Yes</option>
<option>No</option>
<option>Partially</option>
</select>
</td>
<td>Table cell</td>
<td>Table cell</td>
<td>Table cell</td>
</tr>
<tr>
我可以提供的完整开放代码将在代码笔链接中。
我设计这个项目的目的是添加“文本字段”所在的文本框,然后放置“新单元格”按钮,我希望在下面构建另一列。如果可以在文本框中放置帮助或添加爵士乐,请听取所有建议!
谢谢
答案 0 :(得分:0)
我确实做到了这一点。一种方法是在单击某个元素后使用jQuery append
一个新行。请参阅以下代码:
jQuery(document).ready(function(){
var i = 1;
jQuery(".addRow").on('click', function(){
i++;
jQuery('tbody').append('<tr><td><input type="file" name="'+i+'" id="attachment"></td></tr>');
});
});
请注意,您需要在要点击的元素上添加Class
或ID
以添加新行。