El código de la tabla con los botones es el siguiente:
<table class="table table-striped">
<thead>
<tr>
<th>Fecha</th>
<th>Título</th>
<th>Estado</th>
<th>Comentarios</th>
<th>
Acciones <button type="button" class="btn btn-success" data-toggle="modal" data-target="#modal" id="btn-noticia" onclick="limpiarFormulario();">Crear noticia</button>
</th>
</tr>
</thead>
<tbody>
<?php
for ($i = 0; $i < count($noticias); $i++) {
$noticia_actual = $noticias[$i][0];
$comentarios_noticia_actual = $noticias[$i][1];
?>
<tr>
<td><?php echo $noticia_actual -> obtenerFecha(); ?></td>
<td><?php echo $noticia_actual -> obtenerTitulo(); ?>a</td>
<td><?php echo $noticia_actual -> obtenerEstado(); ?></td>
<td><?php echo $comentarios_noticia_actual; ?></td>
<td>
<button type="button" class="btn btn-secondary" data-toggle="modal" data-target="#modal">Editar</button>
<button type="button" class="btn btn-danger" data-toggle="modal" data-target="#modal">Borrar</button>
</td>
</tr>
<?php
}
?>
</tbody>
</table>
El código del modal que contiene los Inputs y el TextArea es:
<div class="modal fade" id="modal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Modal title</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<div class="container">
<input type="hidden" id="id" name="id" />
<div class="form-row">
<div class="form-group col-10">
<label><strong>Titulo:</strong></label>
<input type="text" id="titulo" name="titulo" class="form-control" placeholder="Título de la noticia" value="<?php echo $noticia_actual -> obtenerTitulo(); ?>"/><br/>
</div>
<div class="form-group col-2">
<label><strong>Publicar:</strong></label><br/>
<label class="switch">
<input id="estado" type="checkbox">
<span class="slider round"></span>
</label>
</div>
<label><strong>Texto:</strong></label>
<textarea cols="12" id="texto" name="texto" class="form-control"><?php echo $noticia_actual -> obtenerTexto(); ?></textarea>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Cerrar</button>
<button type="submit" class="btn btn-primary" data-dismiss="modal">Guardar</button>
</div>
</div>
</div>
</div>
Por ultimo el código JavaScript que tengo hecho:
<script type="text/javascript">
$("#btn-noticia").on("click",function() {
$('#titulo').val('');
$('#estado').prop('checked', false).removeAttr('checked');
$('#texto').val('');
});
</script>
La problemática es que cuando limpio los campos al darle en el botón CREAR NOTICIA, y vuelvo a dar click en el botón editar debería mostrarme nuevamente los campos con la información obtenida por medio de PHP, pero los campos se muestran vacíos.
Agradezco cualquier contribución para dar solución a este problema.