Com es crea un filtre de productes de rang de preus mitjançant Jquery Ajax, Python Flask i PostgreSQL

Bloc

Com es crea un filtre de productes de rang de preus mitjançant Jquery Ajax, Python Flask i PostgreSQL

Al vídeo d'avui us mostrarem com crear un filtre de productes en l'interval de preus mitjançant Jquery Ajax Python Flask i PostgreSQL

Subscriure: https://www.youtube.com/c/Cairocoders/featured

Codi font

app.py

#app.py from flask import Flask, render_template, request, jsonify import psycopg2 #pip install psycopg2 import psycopg2.extras app = Flask(__name__) app.secret_key = 'caircocoders-ednalan' DB_HOST = 'localhost' DB_NAME = 'sampledb' DB_USER = 'postgres' DB_PASS = 'admin' conn = psycopg2.connect(dbname=DB_NAME, user=DB_USER, password=DB_PASS, host=DB_HOST) @app.route('/') def index(): return render_template('index.html') @app.route('/fetchrecords',methods=['POST','GET']) def fetchrecords(): cur = conn.cursor(cursor_factory=psycopg2.extras.DictCursor) if request.method == 'POST': query = request.form['action'] minimum_price = request.form['minimum_price'] maximum_price = request.form['maximum_price'] #print(query) if query == '': cur.execute('SELECT * FROM product ORDER BY pid ASC') productlist = cur.fetchall() print('all list') else: cur.execute('SELECT * FROM product WHERE price BETWEEN (%s) AND (%s)', [minimum_price, maximum_price]) productlist = cur.fetchall() return jsonify({'htmlresponse': render_template('response.html', productlist=productlist)}) if __name__ == '__main__': app.run(debug=True)

templates / index.html

//templates/index.html Price Range Product Filters Using Jquery Ajax Python Flask and PostgreSQL

Price Range Product Filters Using Jquery Ajax Python Flask and PostgreSQL


Price

10 - 5000

#loading { text-align:center; background: url('images/loading.gif') no-repeat center; height: 150px; } $(document).ready(function(){ filter_data(); function filter_data() { $('.filter_data').html(' '); var action = 'fetch_data'; var minimum_price = $('#hidden_minimum_price').val(); var maximum_price = $('#hidden_maximum_price').val(); $.ajax({ url:'/fetchrecords', method:'POST', data:{action:action, minimum_price:minimum_price, maximum_price:maximum_price}, success:function(data){ $('.filter_data').html(data); $('.filter_data').append(data.htmlresponse); } }); } $('#price_range').slider({ range:true, min:50, max:5000, values:[50, 5000], step:50, stop:function(event, ui) { $('#price_show').html(ui.values[0] + ' - ' + ui.values[1]); $('#hidden_minimum_price').val(ui.values[0]); $('#hidden_maximum_price').val(ui.values[1]); filter_data(); } }); });

templates / response.html

//templates/response.html {% for row in productlist %}

{{row.name}}

{{row.price}}

{% endfor %}

#python #postgresql

Com es crea un filtre de productes de rang de preus mitjançant Jquery Ajax, Python Flask i PostgreSQL

Al vídeo d'avui us mostrarem com crear un filtre de productes en la gamma de preus mitjançant Jquery Ajax Python Flask i PostgreSQL