Все, что я хочу сделать, это показать информационный фрейм в сети после нажатия кнопки.Я использую flask
и пытался использовать dataTables.js
.Но я довольно плохо знаком со всеми этими инструментами TAT
Так что до сих пор мой вывод таков: после нажатия кнопки я перехожу на страницу ./extract
, и все данные отображаются так:
{"my_table": "\ n \ n \ n trade_date \ n rem_period \ n bond_code \ n bond_name \ n bond_rating \ n bond_yield \ n примечание \ n предложение \ n ставка \ n сумма \ n \ n \ nn \ n \ n 2018-04-04 \ n 8d \ n 1382161 \ n 13 \ u6e1d \ u6c34 \ u6295MTN1 \ n AA + / AAA \ n 3.6 \ n Нет \ n \ u56fd \ u5bff \ u517b \ u8001 \ n \ u94f6\ u534e \ u57fa \ u91d1 \ n 1000 \ n \ n \ n 2018-04-04 \ n 39d \ n 1382227 \ n 13 \ u9ec4 \ u65c5 \ u6e38MTN1 \ n AAA \ n 4.6 \ n Нет \ n \ u4e2d \ u6b27\ u57fa \ u91d1 \ n \ u5706 \ u4fe1 \ u6c38 \ u4e30 \ n 3000 \ n \ n \ n 2018-04-04 \ n 99d \ n 101356002 \ n 13 \ u6e1d \ u5bccMTN001 \ n AAA \ n 4.4 \ n Нет\ n \ u56fd \ u5bff \ u517b \ u8001 \ n
Однако я хочу, чтобы таблица отображалась на странице индекса в правильном формате таблицы. Не могли бы вы взглянуть на проблему?is?
views.py
@app.route('/extract', methods=['GET', 'POST'])
def extract_excel():
file = request.files['file']
filename = file.filename
database_name = FiveComps
...
df = df[df['trade_date'] == request.form['upload_date']]
return jsonify(my_table=df.to_html(classes='table table-striped" id = "a_nice_table', index=False, border=0))
return render_template("index.html")
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Bond</title>
<script src="static/jquery-3.3.1.min.js"></script>
<script src="static/jquery-latest.js"></script>
<!-- DataTables CSS -->
<link rel="stylesheet" type="text/css" href="http://cdn.datatables.net/1.10.15/css/jquery.dataTables.css">
<!-- DataTables -->
<script type="text/javascript" charset="utf8" src="http://cdn.datatables.net/1.10.15/js/jquery.dataTables.js"></script>
<script>
$(document).ready(function() {
$('#showtable').bind("click", function(){
$.getJSON('/extract', function(data){
$("#mytablediv").html(data.my_table);
$('#a_nice_table').DataTable();
});
});
});
</script>
</head>
<body>
<div>
<form action="/extract" method="post" enctype="multipart/form-data">
<input type="file" name="file"></input>
<input type="text" name="upload_date" placeholder="2018-01-01"></input>
<button type="submit" id="showtable">Preview</button>
</form>
<div id="mytablediv">Here should be a table</div>
</div>
</body>
</html>
Я опустил некоторый несвязанный код.