我已创建使用烧瓶和自举一个Web应用程序。在这种应用中,把输入和点击提交按钮后,我想表明的引导模式在同一个页面的输出或结果。但我无法正确地重定向它。如果有任何解决方案,它告诉我。这将是非常有益的。提前致谢。代码如下所示。
home.html的
<div class="container" align="left">
<div class="panel panel-default" style="border:none;border-radius: 10px;">
<div class="panel-body panel1">
<form method="POST" action="/predict">
<div class="row">
<div class="col-sm-6">
<div class="form-group d2">
<label for="NewYork"><p class="p2">New York</p></label>
<input type="text" class="i1" name="NewYork"><br><br>
<small id="NYHelp" class="form-text text-muted s1">Enter 1 if the state selected is New York else enter 0</small>
</div>
<div class="form-group d2">
<label for="california"><p class="p2">California</p></label>
<input type="text" class="i1" name="California"><br><br>
<small id="CaliforniaHelp" class="form-text text-muted s1">Enter 1 if the state selected is New York else enter 0</small>
</div>
<div class="form-group d2">
<label for="Florida"><p class="p2">Florida</p></label>
<input type="text" class="i1" name="Florida"><br><br>
<small id="FloridaHelp" class="form-text text-muted s1">Enter 1 if the state selected is New York else enter 0</small>
</div>
</div>
<div class="col-sm-6">
<div class="form-group d2">
<label for="RnD_Spend"><p class="p2">RnD_Spend</p></label>
<input type="text" class="i1" name="RnD_Spend"><br><br>
<small id="RndSpendHelp" class="form-text text-muted s1">Enter RnD Spendings in US Dollar</small>
</div>
<div class="form-group d2">
<label for="Admin_Spend"><p class="p2">Admin_Spend</p></label>
<input type="text" class="i1" name="Admin_Spend"><br><br>
<small id="AdminSpendHelp" class="form-text text-muted s1">Enter Adminstration Spendings in US Dollar</small>
</div>
<div class="form-group d2">
<label for="Market_Spend"><p class="p2">Market_Spend</p></label>
<input type="text" class="i1" name="Market_Spend"><br><br>
<small id="MarketSpendHelp" class="form-text text-muted s1">Enter Market Spendings in US Dollar</small>
</div>
</div>
</div>
<div class="row" align="right"><input class="btn btn1" type= "submit" value="Submit" data-toggle="modal" data-target="#myModal"></div>
</form>
</div>
</div>
</div>
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLongTitle">Modal title</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
...
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
app.朋友
@app.route("/predict",methods=['GET', 'POST'])
def predict():
NewYork = float(request.form['NewYork'])
California = float(request.form['California'])
Florida = float(request.form['Florida'])
RnD_Spend= float(request.form['RnD_Spend'])
Admin_Spend= float(request.form['Admin_Spend'])
Market_Spend = float(request.form['Market_Spend'])
pred_args =[NewYork, California, Florida, RnD_Spend, Admin_Spend, Market_Spend]
pred_args_arr = np.array(pred_args)
pred_args_arr = pred_args_arr.reshape(1, -1)
mul_reg = open("multiple_linear_model.pkl", "rb")
ml_model = joblib.load(mul_reg)
model_prediction = ml_model.predict(pred_args_arr)
model_prediction = round(float(model_prediction), 2)
return render_template('home.html', prediction = model_prediction)
我会说,它通常不是表单提交后,将用户重定向到同一个网页,但与显示的模式一个很好的做法(这只是不是一个良好的用户体验),我会建议通过使用AJAX的事情了。
无论如何,你可以通过一个标志,告诉HTML模板渲染器是否需要显示模式。事情是这样的:
return render_template(
'home.html',
prediction=model_prediction,
show_predictions_modal=True // This is our flag
)
然后有条件地呈现在模板的模式:
{% if show_predictions_modal %}
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLongTitle">Modal title</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
...
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
{% endif %}