How can I get multiple datas from checkboxes to another modal? If I click on a button, a bootstrap modal appears with some datas. The datas have checkboxes. And I want to print the selected datas on another modal in a table. I'm trying to push the value, but It's just prints the checkbox values and I want to print the name
and the connected to
.
My code
$(document).ready(function() {
$("#checkBtn2").click(function() {
var favorite = [];
$.each($("input[name='case']:checked"), function() {
favorite.push($(this).val());
});
$('#myModal2').modal('show').on('shown.bs.modal', function() {
$("#checkid").html(favorite.join(", "));
});
});
});
<script src="https://code.jquery.com/jquery.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<div class="container">
<div class="row">
<div class="col-sm-6">
<table class="table table-striped table-bordered">
<thead>
<tr>
<th>Name</th>
<th>Connect to</th>
<th>View</th>
</tr>
</thead>
<tbody>
<tr>
<td>Data1</td>
<td>Data2</td>
<td align="center"><input name="case" class="checkboxes" type="checkbox" value="data1"</td>
</tr>
<tr>
<td>Data2</td>
<td>Data3</td>
<td align="center"><input name="case" class="checkboxes" type="checkbox" value="data2"</td>
</tr>
<tr>
<td>Data3</td>
<td></td>
<td align="center"><input name="case" class="checkboxes" type="checkbox" value="data3"</td>
</tr>
<tr>
<td>Data4</td>
<td>Data5</td>
<td align="center"><input name="case" class="checkboxes" type="checkbox" value="data4"</td>
</tr>
<tr>
<td>Data5</td>
<td>Data6</td>
<td align="center"><input name="case" class="checkboxes" type="checkbox" value="data5"</td>
</tr>
<tr>
<td>Data6</td>
<td></td>
<td align="center"><input name="case" class="checkboxes" type="checkbox" value="data6"</td>
</tr>
</tbody>
</table>
</div>
</div>
<input type='button' name='case' id='checkBtn2' value='View' class='btn btn-info'>
</div>
<div class="modal fade" id="myModal2" tabindex="-1" role="dialog" aria-labelledby="basicModal">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
</div>
<div class="modal-body">
<p id="checkid"></p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
Aucun commentaire:
Enregistrer un commentaire