Salvar dados de formulario em aquivo HTML
galera to com um problema que ja faz uns dias que não to conseguindo resolver..
eu to querendo fazer o seguinte : pegar os dados desse formulário e ao clicar em "adicionar membro" ele adicionar automaticamente na tabela de baixo ou de preferencia que salve os dados em um arquivo HTML para que outros usuários possa visualizar.
Cada vez que eu for adicionando vai criando uma nova linha e adicionando os dados..
<html>
<head>
</head>
<body>
<form role="form">
<div class="form-group">
<h2>Composição Familiar</h2>
<form role="form" id="composicaoFamiliar" method="post">
<div class="form-group row">
<div class="col-xs-10">
<label for="nomeC">Nome Completo:</label>
<input type="text" class="form-control" name="nomeC" id="nomeC" placeholder="Nome Completo" required="required" minlength="6" maxlength="20" pattern="[a-z\s]+$"><p>
</div>
<div class="col-xs-10 ">
<label for="sexo">Sexo:</label>
<input type="text" class="form-control" name="sexo" id="sexo" placeholder="Digite o sexo" required="required"><p>
</div>
<div class="col-xs-10 ">
<label for="dataN">Data de Nascimento:</label>
<input type="date" class="form-control" name="dataN" id="dataN" required="required"><p>
</div>
<div class="col-xs-10 ">
<label for="idade">Idade:</label>
<input type="number" class="form-control" name="idade" id="idade" required="required"><p>
</div>
<div class="col-xs-10 ">
<label for="parentescoF">Parentesco Familiar:</label>
<input type="text" class="form-control" name="parentescoF" id="parentescoF" placeholder="Digite o parentesco familiar" required="required"><p>
</div>
<div class="col-xs-10 ">
<label for="defF">Deficiencia:</label>
<input type="text" class="form-control" name="defF" id="defF" placeholder="Digite SIM ou NÃO" required="required"><p>
</div>
<div class="col-xs-8 ">
</div>
</div>
<button id="adicionarM" type="submit" class="btn btn-default" ">Adicionar Membro</button>
</form>
<table class="table table-bordered" id="tabela">
<tbody>
<tr>
<th>Nome Completo</th>
<th>Sexo</th>
<th>Data de Nascimento</th>
<th>Idade</th>
<th>Parentesco Familiar</th>
<th>Deficiencia?</th>
</tr>
</thead>
<tbody>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
</tbody>
</table
</form>
<button id="botaocadastrar" type="submit" class="btn btn-default">Cadastrar >></button>
<button id="botaovoltar" type="submit" class="btn btn-default"><< Voltar </button>
</div>
</form>
</body>
</html>Discussão (0)
Carregando comentários...