<div class="form" id="dynamicDiv">
<p>
<div id="principal">
<form method="POST" action='enviaMform.php' id="enviaMform">
<div class="container">
<label for="ipHost">Nome do host:</label>
<input type="text" id="inputeste" size="20" value="" placeholder=""
name="nomeHost" class="form-control"/>
<div class="form-group">
<label for="ipHost">Ip do host:</label>
<input type="text" max="12" name="ipHost" class="form-control"/>
</div>
<div class="form-group">
<label for="sistemaOperacional">Sistema operacional:</label>
<input type="text" class="form-control" name="sistemaOperacional">
</div>
<div class="form-group">
<label for="marcaModelo">Serviço hospedado no host:</label>
<input type="text" class="form-control" name="servicoHospedado">
</div>
<div class="form-group">
<label for="tpMonitoramento">Tipo de monitoramento:</label>
<div class="form-control">
<input type="checkbox" value="Simples" name="tpMonitoramento[]" />
<label for="simples">Simples</label>
</div><br>
<div class="form-control">
<input type="checkbox" value="ZabbixAgent" name="tpMonitoramento[]" />
<label for="Zabbix Agent">Zabbix Agent</label>
</div> <br>
<div class="form-control">
<input type="checkbox" value="MonitoramentoWeb" name="tpMonitoramento[]"
/> <label for="simples">Monitoramento Web</label>
</div><br>
<div class="form-control">
<input type="checkbox" value="MonitoramentoODBC"
name="tpMonitoramento[]" /> <label for="simples">Monitoramento
ODBC</label>
</div> <br>
<div class="form-group">
<div id="dynamicDiv" class="form-group">
<p>
<a class="btn btn-primary" href="javascript:void(0)" id="addInput">
<span class="glyphicon glyphicon-plus" aria-hidden="true"></span>
Deseja monitorar mais um host?
</a>
Bem,tenho esse formulário enorme e descobri como repeti-lo com o Jquery por meio desse código que basicamente o replica.
<script>
$(function () {
var scntDiv = $('#dynamicDiv');
$(document).on('click', '#addInput', function () {
$('<p class="remInput">'+
'<div class="container">'+
'<form method="POST" action="enviaMform.php" id="enviaMform">'+
'<div class="form-group">'+
'<label for="nomeHost">Nome do host:</label>'+
'<input type="text" size="20" value="" placeholder="" name="nomeHost" class="form-control"/> '+
'</div>'+
'<div class="form-group">'+
'<label for="ipHost">Ip do host:</label>'+
'<input type="text" size="20" value="" placeholder="" name="ipHost" class="form-control" /> '+
'</div>'+
'<div class="form-group">'+
'<label for="nomeHost">Sistema operacional:</label>'+
'<input type="text" size="20" value="" placeholder="" class="form-control" name="sistemaOperacional" /> '+
'<div>'+
'<div class="form-group">'+
'<label for="servicoHospedado">Servico hospedado no host:</label>'+
'<br>'+
'<input type="text" size="20" value="" placeholder="" class="form-control" name="servicoHospedado" /> '+
'</div>'+
'<label for="tpMonitoramento">Tipo de monitoramento:</label>' +
'<div class="form-control">'+
'<input type="checkbox" value="Simples" name="tpMonitoramento[]" /> <label for="simples">Simples</label>'+
'</div><br>'+
'<div class="form-control">'+
'<input type="checkbox" value="ZabbixAgent" name="tpMonitoramento[]" /> <label for="Zabbix Agent">Zabbix Agent</label>'+
'</div> <br>'+
'<div class="form-control">'+
'<input type="checkbox" value="MonitoramentoWeb" name="tpMonitoramento[]" /> <label for="simples">Monitoramento Web</label>'+
'</div><br>'+
'<div class="form-control">'+
'<input type="checkbox" value="MonitoramentoODBC" name="tpMonitoramento[]" /> <label for="simples">Monitoramento ODBC</label>'+
'</div> <br>' +
'</div>'+
'<div align="center">'+
'<input type="submit" value="Enviar" class="btn btn-info btn-block" onclick="myFunction()" style="color: #2196F3;"/>'+
'</div>'+
'<div class="form-group">'+
'<a class="btn btn-danger" href="javascript:void(0)" id="remInput">'+
'<span class="glyphicon glyphicon-minus" aria-hidden="true"></span> '+
'Remover Campo'+
'</a>'+
'</form>'+
'</div>'+
'</p>').appendTo(scntDiv);
return false;
});
$(document).on('click', '#remInput', function () {
$(this).parents('p').remove();
return false;
});
});
Bem,atualmente,não há problema em salvar os dados que o formulário passa,porém,se eu o "replico",só consigo salvar os dados do formulário que dei submit. Por exemplo:Gerei 5 formulários e os preenchi.Independente da ordem que eu os repliquei,só conseguirei receber os dados do formulário que dei submit.No caso,se eu apertar o do formulário número 4,me chega somente os dados dele,ignorando todos os outros que já foram respondidos nessa mesma página.
$(function(){
$('#enviaMform').submit(function(event){
event.preventDefault();
var formDados = new FormData($(this)[0]);
$.ajax({
url:'enviaMform.php',
type:'POST',
data:formDados,
cache:false,
contentType:false,
processData:false,
success:function (data)
{
$('#enviaMform').each (function(){
this.reset();
});
},
dataType:'html'
});
return false;
});
});
Já tentei mudar os valores do name para serem passados como arrays(EX:nomeHost[])e dar um json_encode para salvá-los como string na minha página de tratamento de dados,mas independente disso,somente os dados do formulário qual cliquei no submit,são enviados. Minha dúvida é: Há algum modo de enviar todos os submits dessa página juntos? Se sim,eu teria de mudar algo na hora de salvá-los no banco de dados?
name
terão que ser todos em forma de array.var formHtml = $("#enviaMform").html()
e depois faz um append:$("#enviaMform").append(formHtml)