Using query to fetch large data and display in HTML table with flask in Python
Browser will freeze when you pull that much data.
To avoid that use server-side pagination and provide queries with page number to backend.
PAGE_SIZE = 10def get_paginated_result(page): # creating connection Object which will contain SQL Server Connection connection = pypyodbc.connect('Driver={SQL Server}; Server=Server; Database=DB; UID=UserID; PWD= {Password};') # Creating Cursor cursor = connection.cursor() order_by = 'id' # should always be validated (if you get from args) offset = (page - 1) * PAGE_SIZE cursor.execute( "select A, B, C, D from TABLE ORDER BY %s OFFSET %d ROWS FETCH NEXT %d ROWS ONLY" % (order_by, offset, PAGE_SIZE) ) Result=cursor.fetchall() return result@app.route('/index', methods=['GET', 'POST'])def view_index(): page = abs(int(request.args.get('page'))) Result = get_paginated_result(page) return render_template('index.html', Result=Result)@app.route('/ajax_table', methods=['GET'])def ajax_table(): page = abs(int(request.args.get('page'))) Result = get_paginated_result(page) return render_template('ajax_table.html', Result=Result)
After that you'll need to extract table to separate HTML file ajax_table.html
. So you'll have main page and table that can be paginated. For pagination recommend to use Bootstrap Pagination and add JS code to load from /ajax_table
and replace table content with another page.