Is there any way I can use the javascript cookies to store information for 3 hours for example?
In my scenario, I need to have a warning page, but I do not need to save those records to the database. I need these warnings to remain for at least 3 hours on the page after it expires.
Looking over javascript found this cookie . So I basically wanted to have a textarea with a submit button, and when the user wrote the warning and clicked on the button, in> appear in a div and stay there for 3 hours.
But I have no idea how to do this and do not know if it is feasible.
* Remembering here that there would be several warnings. That is, it may be that on day you can have more than one warning, so I wanted to show everyone, and according to the time they disappear from the page.
Could anyone help me? Is there any other way I can do this without having to create tables and have the time to expire?
EDIT
I made a code here that works. But I wanted to adapt it to my scenario. That is, the warning stays there for 3 hours and then expires.
<div class="row">
<h3>Digite o aviso</h3>
<form id="frmCadastro">
<textarea id="aviso" rows="10" cols="100"></textarea>
<br />
<input type="submit" value="Salvar" id="btnSalvar" class="btn btn-info btn-lg" />
</form>
</div>
<script>
$(function () {
var operacao = "A"; //"A"=Adição; "E"=Edição
var indice_selecionado = -1;
var tbClientes = localStorage.getItem("tbClientes");// Recupera os dados armazenados
tbClientes = JSON.parse(tbClientes); // Converte string para objeto
if (tbClientes == null) // Caso não haja conteúdo, iniciamos um vetor vazio
tbClientes = [];
function Adicionar() {
var cliente = JSON.stringify({
Aviso: $("#aviso").val(),
});
tbClientes.push(cliente);
localStorage.setItem("tbClientes", JSON.stringify(tbClientes));
return true;
}
function Editar() {
tbClientes[indice_selecionado] = JSON.stringify({
Aviso: $("#aviso").val(),
});
localStorage.setItem("tbClientes", JSON.stringify(tbClientes));
operacao = "A";
return true;
}
function Listar() {
$("#tblListar").html("");
$("#tblListar").html(
"<thead>" +
"<tr>" +
"<th>Avisos</th>" +
"</tr>" +
"</thead>" +
"<tbody>" +
"</tbody>"
);
for (var i in tbClientes) {
var cli = JSON.parse(tbClientes[i]);
$("#tblListar tbody").append("<tr>" +
" <td>" + cli.Aviso + "</td>" +
" <td><img src='Imagens/edit.png' alt='" + i + "' class='btnEditar'/><img src='Imagens/deleta.png' alt='" + i + "' class='btnExcluir'/></td>" +
"</tr>");
}
}
function Excluir() {
indice_selecionado = parseInt($(this).attr("alt"));
tbClientes.splice(indice_selecionado, 1);
localStorage.setItem("tbClientes", JSON.stringify(tbClientes));
alert("Aviso excluído.");
}
function GetCliente(propriedade, valor) {
var cli = null;
for (var item in tbClientes) {
var i = JSON.parse(tbClientes[item]);
if (i[propriedade] == valor)
cli = i;
}
return cli;
}
Listar();
$("#frmCadastro").bind("submit", function () {
if (operacao == "A")
return Adicionar();
else
return Editar();
});
$(".btnEditar").bind("click", function () {
operacao = "E";
indice_selecionado = parseInt($(this).attr("alt"));
var cli = JSON.parse(tbClientes[indice_selecionado]);
$("#aviso").val(cli.Aviso);
$("#aviso").focus();
});
$(".btnExcluir").bind("click", function () {
indice_selecionado = parseInt($(this).attr("alt"));
Excluir();
Listar();
});
});
</script>