Array
(
)

Bloquear Refresh em Página Específica

Sidney Abreu
   - 24 ago 2016

Boa tarde, amigos estou desenvolvendo um sistema web, onde crio vários elementos dinamicamente, o problema é que quando se dar um refresh na página eles se auto destroem, perdendo os dados preenchidos e os elementos criados.
Tem alguma forma de bloquear o refresh para uma pagina específica?

Matheus
   - 10 set 2016

Sim, mas que tipos de elementos que você esta criando dinamicamente? inputs, divs...? forneça o código

Sidney Abreu
   - 10 set 2016

#Código<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>teste</title>
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
<script src="jquery-1.3.2.min.js" type="text/javascript"></script>
<script>
$(document).ready(function(){
$("#addTrajetoVolta").click(function(evento){

$("#BlocoVolta").css("display", "block");

});
});
</script>

</head>
<body >
<div class="row"> </div>
<div class="panel panel-default">
<div class="panel-heading"><span class="subtitulo">Dados do Registro</span></div>
<div class="panel-body">
<form class="form-horizontal" name="form1" id="form1">
<div class="form-group form-group-sm">
<div class="col-md-3">
<label for="exampleInputName2">Número do Ofício</label>
<div class="input-group">
<span class="input-group-addon">
221111-
</span>
<input type="text" class="form-control" id="exampleInputName3" placeholder="" >

<span class="input-group-addon">
/2016
</span>
</div><!-- /input-group -->

</div>
<div class="col-md-2">
<label for="exampleInputName2">Data da Solicitação</label>
<input type="date" class="form-control" id="exampleInputName2" placeholder="" readonly="true">
</div>
<div class="col-md-4">
<label for="exampleInputName2">Orgão</label>
<input type="text" class="form-control" id="exampleInputName2" placeholder="" readonly="true">
</div>
<div class="col-md-3">
<label for="exampleInputName2">Solicitante</label>
<input type="text" class="form-control" name="Solicitante" placeholder="" readonly="true">
</div>
</div>

<div class="bs-callout bs-callout-nova" >
<div class="row subtitulo Azul"><strong><i class="fa fa-map-marker" aria-hidden="true"></i> Trajeto de Ida</strong></div>
<div class="form-group form-group-sm">
<div class="col-md-2">
<label for="exampleInputName2">Origem</label>
<input type="text" class="form-control" name="Solicitante" placeholder="">
</div>

<div class="col-md-2">
<label for="exampleInputName2">Destino</label>
<input type="text" class="form-control" name="Solicitante" placeholder="">
</div>

<div class="col-md-2">
<label for="exampleInputName2">Data Embarque</label>
<input type="date" class="form-control" name="Solicitante" placeholder="">
</div>

<div class="col-md-2">
<label for="exampleInputName2">Horário</label>
<input type="time" class="form-control" name="Solicitante" placeholder="">
</div>

<div class="col-md-2">
<label for="exampleInputName2">Horário</label>
<select class="selectpicker form-control">
<option>CONVECIONAL</option>
<option>EXCUTIVO</option>
<option>LEITO</option>
</select>

</div>

<div class="col-md-2">
<label for="exampleInputName2">Empresa</label>
<input type="text" class="form-control" name="Solicitante" placeholder="">
</div>

</div>

<div class="form-group form-group-sm">
<div class="col-md-1">
<label for="exampleInputName2">Status</label>
<p class="corAzul"><i class="fa fa-caret-right" aria-hidden="true" ></i> <strong>Nova</strong></p>
</div>

<div class="col-md-4">
<label for="exampleInputName2">Passageiro</label>
<input type="text" class="form-control" name="iPassageiro" placeholder="">
</div>

<div class="col-md-2">
<label for="exampleInputName2">Identidade</label>
<input type="text" class="form-control" name="iIdentidade" placeholder="">
</div>

<div class="col-md-2">
<label for="exampleInputName2">CPF</label>
<input type="text" id="iCPF" onKeyPress="MascaraCPF(form1.iCPF);"
maxlength="14" onBlur="ValidarCPF(form1.iCPF);" class="form-control" name="iCPF" placeholder="">
</div>

<div class="col-md-2">
<label for="exampleInputName2">Cartão Fidelidade</label>
<input type="text" class="form-control" name="iCartao" placeholder="">
</div>

<div class="col-md-1">
<label for="exampleInp utName2"> </label>
<a class="form-control btn btn-danger" href="">Remover </a>
</div>

</div>

<div class="form-group form-group-sm" id="passageiro">
<!-- Novo Passageiro -->
</div>

<a class="btn btn-primary" href="javascript:void(0)" id="add_field">Adicionar Passageiro</a>
<a class="btn btn-warning" href="javascript:void(0)" id="">Remover Trajeto</a>
<a class="btn btn-info" href="javascript:void(0)" id="addTrajetoVolta">Solicitar "ida e volta" para este trajeto</a>

</div>

<!-- Trajeto de Volta -->
<div class="bs-callout bs-callout-nova" id="BlocoVolta">
<div class="row subtitulo Vermelho"><strong><i class="fa fa-map-marker" aria-hidden="true"></i> Trajeto de Volta</strong></div>
<div class="form-group form-group-sm">
<div class="col-md-2">
<label for="exampleInputName2">Origem</label>
<input type="text" class="form-control" name="Solicitante" placeholder="">
</div>

<div class="col-md-2">
<label for="exampleInputName2">Destino</label>
<input type="text" class="form-control" name="Solicitante" placeholder="">
</div>

<div class="col-md-2">
<label for="exampleInputName2">Data Embarque</label>
<input type="date" class="form-control" name="Solicitante" placeholder="">
</div>

<div class="col-md-2">
<label for="exampleInputName2">Horário</label>
<input type="time" class="form-control" name="Solicitante" placeholder="">
</div>

<div class="col-md-2">
<label for="exampleInputName2">Horário</label>
<select class="selectpicker form-control">
<option>CONVECIONAL</option>
<option>EXCUTIVO</option>
<option>LEITO</option>
</select>

</div>

<div class="col-md-2">
<label for="exampleInputName2">Empresa</label>
<input type="text" class="form-control" name="Solicitante" placeholder="">
</div>

</div>

<div id="TrajetoVolta">

</div>

</div>
<!-- fim trajeto de volta -->

<a class="btn btn-primary" href="javascript:void(0)" id="">Adicionar Trajeto</a>
<button type="button" class="btn btn-success">Finalizar Ofício e Enviar</button>
<button type="button" class="btn btn-danger">Cancelar Ofício</button>
</form>
</div>
</div>
<!-- / Formulario -->
</div>

<script>
$(function () {
$(document).ready(function() {
var max_fields = 10; //max de 15 inscricoes de cada vez
var x = 1;
$('#add_field').click (function(e) {
e.preventDefault(); //prevenir novos clicks
if (x < max_fields) {
$('#passageiro').append('\\
<div class="remove' + x + '">\\
<div class="col-md-1">\\
<label for="exampleInputName2">Status</label>\\
<p class="corAzul"><i class="fa fa-caret-right" aria-hidden="true" ></i> <strong>Nova</strong></p></div>\\
<div class="col-md-4">\\
<label for="exampleInputName2">Passageiro</label>\\
<input type="text" class="form-control" id="iPassageiro" name="iPassageiro[]" placeholder="">\\
</div>\\
<div class="col-md-2">\\
<label for="exampleInputName2">Identidade</label>\\
<input type="text" class="form-control" name="iIdentidade[]" id="iIdentidade" placeholder="">\\
</div>\\
<div class="col-md-2">\\
<label for="exampleInputName2">CPF</label>\\
<input type="text" maxlength="14" class="form-control" name="iCPF[]" id="iCPF" placeholder="">\\
</div>\\
<div class="col-md-2">\\
<label for="exampleInputName2">Cartão Fidelidade</label>\\
<input type="text" class="form-control" name="iCartao[]" id="iCartao" placeholder="">\\
</div>\\
<div class="col-md-1">\\
<label for="exampleInp utName2"> </label>\\
<a class="form-control btn btn-danger remove_campo" id="remove' + x +'" href="">Remover</a>\\
</div>\\
</div>\\
');
x++;
}
});

//this is not the best move, because will create overhead...
//but is for simplicity
//damn users
$('#passageiro').on("click",".remove_campo",function(e) {
e.preventDefault();
var tr = $(this).attr('id');
//alert ('remove: ' + tr);
$('#passageiro div.'+ tr).remove();
x--;
});

});
});
</script>

<script>
$(function () {
$(document).ready(function() {
var max_fields = 2; //max de 15 inscricoes de cada vez
var x = 1;
$('#addTrajetoVolta').click (function(e) {
e.preventDefault(); //prevenir novos clicks
if (x < max_fields) {
$('#TrajetoVolta').append('\\
<div class="remove' + x + '">\\
<div class="form-group form-group-sm">\\
<div class="col-md-1">\\
<label for="exampleInputName2">Status</label>\\
<p class="corAzul"><i class="fa fa-caret-right" aria-hidden="true" ></i> <strong>Nova</strong></p></div>\\
<div class="col-md-4">\\
<label for="exampleInputName2">Passageiro</label>\\
<input type="text" class="form-control" id="iPassageiro" name="iPassageiro[]" placeholder="">\\
</div>\\
<div class="col-md-2">\\
<label for="exampleInputName2">Identidade</label>\\
<input type="text" class="form-control" name="iIdentidade[]" id="iIdentidade" placeholder="">\\
</div>\\
<div class="col-md-2">\\
<label for="exampleInputName2">CPF</label>\\
<input type="text" maxlength="14" class="form-control" name="iCPF[]" id="iCPF" placeholder="">\\
</div>\\
<div class="col-md-2">\\
<label for="exampleInputName2">Cartão Fidelidade</label>\\
<input type="text" class="form-control" name="iCartao[]" id="iCartao" placeholder="">\\
</div>\\
<div class="col-md-1">\\
<label for="exampleInp utName2"> </label>\\
<a class="form-control btn btn-danger remove_campo" id="remove' + x +'" href="">Remover</a>\\
</div>\\
</div>\\
<a class="btn btn-danger" href="" id="RemoveBlocoVolta">Remover Solicitação "ida e volta" para este trajeto</a>\\
</div>\\
');
x++;
}
});

});
});

</script>

<script>
$(document).ready(function(){
$("#RemoveBlocoVolta1").click(function(evento){

$("#BlocoVolta").remove();

});
});

</script>

<script src="js/MascaraValidacao.js" type="text/javascript"></script>
</body>
</html>

Matheus
   - 10 set 2016

Pesquise sobre o método preventDefault ou defaultPrevented

ps: Que código confuso. hahaha!

Marcelo Santana
|
MVP
Pontos: 550
    10 set 2016

Boa tarde, Sidney Abreu. Por gentileza, poderia postar o código completo da sua html.. Assim ficará mais fácil para a galera te ajudar... :)

Abraço,