If you can help me with this question of how to pass the data filled from a form that is in a modal to a new row in a table. And that it accumulates every time you open the modal to fill the form, and the option to delete the row.
This is my modal.
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
<div class="modal-dialog" role="document">
<div class="modal-content">
<form id="myForm" method="post">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
aria-hidden="true"></span></button>
<h4 class="modal-title" id="myModalLabel">Agregar accion a Clientecentrico</h4>
</div>
<div class="modal-body">
<div class="form-group">
<label>Tipo:</label>
</div>
<div class="form-group">
<label class="radio-inline">
<input type="radio" name="optradio" value="70 - Experiencia">70 - Experiencia
</label>
<label class="radio-inline">
<input type="radio" name="optradio" value="20 - Trabajo con otros">20 - Trabajo con otros
</label>
<label class="radio-inline">
<input type="radio" name="optradio" value="10 - Formación formal">10 - Formación formal
</label>
</div>
<br>
<div class="form-group">
<textarea id="comentarios" required="required" rows="5"
class="form-control" name="message"
data-parsley-trigger="keyup"
data-parsley-minlength="20"
data-parsley-maxlength="1000"
data-parsley-minlength-message="Come on! You need to enter at least a 20 caracters long comment.."
data-parsley-validation-threshold="10" placeholder="Accion."></textarea>
</div>
<div class="form-group">
<label>Fecha fin:</label>
<div class='input-group date' id='myDatepicker'>
<input type='text' id="fecha_final" class="form-control"/>
<span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span></span>
</div>
</div>
</div>
<div class="modal-footer">
<button type="reset" class="btn btn-default" data-dismiss="modal" onclick="myFunction()">
Cerrar
</button>
<button type="button" class="btn btn-primary">Crear</button>
</div>
</form>
</div>
</div>
</div>
And the table is this
<table id="tabla-acciones" class="table table-bordered">
<thead>
<tr>
<th>Tipo</th>
<th>Accion</th>
<th>Fecha fin</th>
</tr>
</thead>
<tbody>
<tr>
</tr>
</tbody>
Here is the script I am trying
$('#crearAccion').click(function () {
var tipo = $('#optradio').val();
var accion = $('#comentarios').val();
var fechafin = $('#fecha_final').val();
$('table tbody').append('<tr><td>' + tipo + '</td><td>' + accion + '</td><td>' + fechafin + '</td></tr>');
});