如何使用JS动态地将值从表复制到输入字段?我想做这样的事情 - 如果我点击表格行,它应该被添加到输入字段中,如果我点击另一行,它应该在","之后添加。在相同的输入字段中。这样的事情(http://prog.linkstraffic.net/jquery/table_row_event_fill_table.html),但它应该从表 - >输入字段。我还是JS新手:( 我从MySQL表中获取数据:
<input id="cel" placeholder="Phone number" type="text" name="number"></input>
<table name="users" class="ui compact celled definition table">
<?php
$result = $pdo->query("SELECT * FROM users");
echo
'<table id="sourcetable">
<thead class="full-width">
<tr id="sour">
<th>Login</th>
<th>Phone</th>
</tr>
</thead>';
foreach ($result as $row)
{ ?>
<tr id="sour">
</div>
<td id="td" style="cursor:pointer"><?php echo $row['login']?></td>
<td style="cursor:pointer"><?php echo $row['phone']?></td></tr>
</div>
<?php
}
$result->closeCursor();
echo '</table>';
?>
</table>
答案 0 :(得分:0)
更改了source table:
var addedrows = new Array();
$(document).ready(function() {
$( "#tbId tbody tr" ).on( "click", function( event ) {
var ok = 0;
var id = $( this ).attr('id').replace("tr","");
var newaddedrows = new Array();
for (index = 0; index < addedrows.length; ++index) {
// if already selected then remove
if (addedrows[index] == id) {
newaddedrows.splice(addedrows.indexOf(index), 0);
ok = 1;
} else {
newaddedrows.push(addedrows[index]);
}
}
addedrows = newaddedrows;
if (!ok) {
addedrows.push(id);
}
$('#inptTxt').val(addedrows.toString());
console.log(addedrows.toString());
});
});
&#13;
table{
border: 1px solid black;
}
td{
background-color: #CCC;
}
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table id="tbId">
<thead>
<tr>
<th>ID</th>
<th>Name</th>
<th>Url</th>
<th>Country</th>
<th>Item</th>
</tr>
</thead>
<tbody>
<tr id="tr0">
<td>1</td>
<td>Name 1</td>
<td>url 1</td>
<td>Country 1</td>
<td>Item 1</td>
</tr>
<tr id="tr1">
<td>2</td>
<td>Name 2</td>
<td>url 2</td>
<td>Country 2</td>
<td>Item 2</td>
</tr>
<tr id="tr2">
<td>3</td>
<td>Name 3</td>
<td>url 3</td>
<td>Country 3</td>
<td>Item 3</td>
</tr>
</tbody>
</table>
<hr>
<input type="text" id="inptTxt">
&#13;