1
I need to have my form send data to another server page for it to enter in Mysql but redirect the user to another page but receive a success message. But for some reason, the message is missing.
Form + JS:
$().ready(function() {
function onFinish() {
//here you can do something, sent the form to server via ajax and show a success message with swal
var nomep = $("#nome");
var descricao = $("#descricao");
var ponto_minimo = $("#ponto_minimo");
var ponto_maximo = $("#ponto_maximo");
var quantidade = $("#quantidade");
var localizacao = $("#localizacao");
var categoria_id = $("#categoria_id");
var usuario = $("#usuario");
var data = $("#data");
var justificativa = $("#justificativa");
$.post("assets/php/alterar-produto.php", {
nome: nomep,
descricao: descricao,
ponto_minimo: ponto_minimo,
ponto_maximo: ponto_maximo,
quantidade: quantidade,
localizacao: localizacao,
categoria_id: categoria_id,
usuario: usuario,
data: data,
justificativa: justificativa
});
setTimeout(function() {
swal({
title: "Sucesso!",
text: "Alterações salvas com êxito",
type: "success"
}, function() {
window.location = "redirectURL";
});
}, 1000);
}
}
<form method="POST" action="#">
<div class="row">
<div class="col-md-10 col-md-offset-1">
<div class="form-group">
<label>Nome</label>
<input type="text" placeholder="Insira um nome" class="form-control" value="<?=utf8_encode($produto['nome'])?>" name="nome">
</div>
</div>
</div>
...Demais campos...
</form>
Full form:
<div class="content">
<form>
<div class="row">
<div class="col-md-10 col-md-offset-1">
<div class="form-group">
<label>Nome</label>
<input type="text" placeholder="Insira um nome" class="form-control" value="<?=utf8_encode($produto['nome'])?>" name="nome">
</div>
</div>
</div>
<div class="row">
<div class="col-md-10 col-md-offset-1">
<div class="form-group">
<label for="descricao">Descrição</label>
<textarea class="form-control" placeholder="Insira a Descrição" rows="3" name="descricao"><?=utf8_encode($produto['descricao'])?></textarea>
</div>
</div>
</div>
<div class="row">
<div class="col-md-5 col-md-offset-1">
<div class="form-group">
<label>Ponto mínimo</label>
<input type="number" placeholder="Insira o Ponto mínimo" class="form-control" value="<?=utf8_encode($produto['ponto_minimo'])?>" name="ponto_minimo">
</div>
</div>
<div class="col-md-5">
<div class="form-group">
<label>Ponto máximo</label>
<input type="number" placeholder="Insira o Ponto máximo" class="form-control" value="<?=utf8_encode($produto['ponto_maximo'])?>" name="ponto_maximo">
</div>
</div>
</div>
<div class="row">
<div class="col-md-10 col-md-offset-1">
<div class="form-group">
<label>Quantidade</label>
<input type="number" placeholder="Insira uma quantidade" class="form-control" value="<?=utf8_encode($produto['quantidade'])?>" name="quantidade">
</div>
</div>
</div>
<div class="row">
<div class="col-md-10 col-md-offset-1">
<div class="form-group">
<label>Localização</label>
<input type="text" placeholder="Insira o Local" class="form-control" value="<?=utf8_encode($produto['localizacao'])?>" name="localizacao">
</div>
</div>
</div>
<?php $categorias = listaCategorias($conexao); ?>
<div class="row">
<div class="col-md-10 col-md-offset-1">
<select name="categoria_id" class="selectpicker" data-title="Categoria" data-style="btn-default btn-block" data-menu-style="dropdown-blue">
<?php foreach($categorias as $categoria) :
$essaEhACategoria = $produto['categoria_id'] == $categoria['id'];
$selecao = $essaEhACategoria ? "selected='selected'" : "";
?>
<option value="<?=$categoria['id']?>" <?=$selecao?>>
<?=utf8_encode($categoria['nome'])?>
</option>
<?php endforeach ?>
</select>
</div>
</div>
<br/>
<input type="hidden" name="usuario" value="<?=$usuario?>">
<input type="hidden" value="<?=$data = date('Y-m-d H:i'); ?>" name="data">
<input type="hidden" value="<?=$produto['id']?>" name="id">
<hr>
<div class="row">
<div class="col-md-10 col-md-offset-1">
<div class="form-group">
<label for="justificativa">Justificativa</label>
<textarea class="form-control" placeholder="Insira a Justificativa" rows="3" name="justificativa" required></textarea>
</div>
</div>
</div>
<div class="row">
<div class="col-md-10 ">
<button type="submit" class="btn btn-fill btn-info center-block" onclick="onFinish()">Enviar</button>
</div>
</div>
</form>
Inclusion of Sweetalert
<!-- Sweet Alert 2 plugin -->
<script src="assets/js/sweetalert2.js"></script>
link to what’s in the Sweetl file
I need to put my button as "Submit"?
– Luhan Salimena
When I click the Submit button nothing happens
– Luhan Salimena
Naturally it will make the asynchronous requisition and activate the swal, after that click on the swal it will redirect.
– Leonardo Bonetti
But @Luhansalimena if you haven’t changed your old code, it will do the same as before, however I just added a "new parameter" that redirects when you click on the warning.
– Leonardo Bonetti
So I need to take the action out of the form?
– Luhan Salimena
@Luhansalimena Before, did it show the warning? If yes, when you clicked on the warning it did not redirect correctly?
– Leonardo Bonetti
No, neither before nor now
– Luhan Salimena
@Luhansalimena Aai gets hard kkk, you didn’t say the problem was Submit. But beauty, let’s solve your problem !
– Leonardo Bonetti
I tested again here and the insertion and not even the message work
– Luhan Salimena
Let’s go continue this discussion in chat.
– Luhan Salimena
I was able to send the data but I can’t get the message to appear
– Luhan Salimena
I will edit Javascript, correct there and see if it works.
– Leonardo Bonetti
@Luhansalimena you changed your JAVASCRIPT? edit the question please? thanks
– Leonardo Bonetti
I edited the question with the code
– Luhan Salimena
@Luhansalimena you are importing the Sweet Alert library straight ?
– Leonardo Bonetti
I use the code that came with my design I will ask the question
– Luhan Salimena