Bom dia, pessoal. Estou criando um projeto pessoal em Flask e a minha primeira etapa é fazer um cálculo relativamente simples de conversão de densidade de petróleos pela temperatura, retornando o valor de densidade a 20/4 e seu grau API. Quando coloco os inputs, os valores corretos são retornados, mas, em virtude de fazer uma requisição ao servidor, os valores que o usuário coloca no input desaparecem, o que eu não queria que ocorresse. Ou seja, queria que o cálculo fosse feito, retornasse o valor ao cliente na tela, mas mantivesse os valores colocados no input pelo usuário. Vou deixar os códigos que utilizei:
Arquivo Flask - principal.py:
from flask import Flask, render_template, request
from calculo_densidade import*
app = Flask(__name__) #objeto do tipo Flask
@app.route('/',methods=['GET','POST'])
def index():
api = ''
rho = ''
if request.method == "POST":
rho_i = float(request.form['rho'])
temp = float(request.form['temp'])
rho = round(Densidade(rho_i,temp).d_calc()[0],4)
api = round(Densidade(rho_i,temp).d_calc()[1],2)
return render_template('densidade.html',rho=str(rho)+" g/cc",api=str(api)+" API")
if __name__=="__main__":
app.run(debug=True)Trecho do arquivo densidade.html ...
<div class="form-group col-lg-6 col-md-6 col-sm-12">
<label class="col-form-label col-form-label-lg">Insira a temperatura do densímetro</label>
<input type="text" placeholder="em Celsius" class="form-control form-control-lg temp" id="temp" name="temp">
</div>
</div>
<div class="form-group row text-center justify-content-center my-3">
<button class="btn btn-lg dens" type="submit" style="min-width: 200px;">Calcular</button>
</div>
</form>
<div class="row text-center justify-content-center" style="margin-top: 40px">
<h2>Resultados obtidos</h2>
</div>
<div class="row text-center my-3" id="resultados">
<h4 class="form-group col-lg-12 col-md-12 col-sm-12" id="densidade_final">
{{ rho }}
</h4>
<h4 class="form-group col-lg-12 col-md-12 col-sm-12" id="API_final">
{{ api }}
</h4>
</div>Tentei usar ajax, mas não deu certo, pois agora os valores calculados não eram retornados ao cliente, apesar de manter o input com os valores colocados pelo usuário. Meu código:
$("form").on("submit", function (e) {
var dataString = $(this).serialize();
e.preventDefault();
$.ajax({
type: "POST",
url: "/",
data: dataString,
success: function () {
// Display message back to the user here
console.log("ok")
}
});
}
);Quem puder me ajudar, agradecerei.
