Python Forum
Thread Rating:
  • 0 Vote(s) - 0 Average
  • 1
  • 2
  • 3
  • 4
  • 5
Flask SelectField using Ajax
#1
Hi, Trying to get a Web Application up and Running: I am trying to do an SQL SELECT Statement based on the First Select-field while i select an item within the first Select Field I'm receiving a 404 Error:

127.0.0.1 - - [23/Mar/2020 15:43:44] "GET /create-vm HTTP/1.1" 200 -
127.0.0.1 - - [23/Mar/2020 15:43:44] "GET /category/VC-AMS01 HTTP/1.1" 404 -
127.0.0.1 - - [23/Mar/2020 15:43:54] "GET /category/VC-OBIEE-SD01 HTTP/1.1" 404 -
127.0.0.1 - - [23/Mar/2020 15:43:59] "GET /category/VC-VDESK-LASCOL HTTP/1.1" 404 -
127.0.0.1 - - [23/Mar/2020 15:44:04] "GET /category/VC-ORCLAPPS-LASCOLO1 HTTP/1.1" 404 -
127.0.0.1 - - [23/Mar/2020 15:54:48] "GET /category/VC-QCT-BLR01 HTTP/1.1" 404 -


from flask import Flask, render_template, g, flash, jsonify
from flask_wtf import FlaskForm
from wtforms import SelectField
from flask_mysqldb import MySQL

app = Flask(__name__)
mysql = MySQL(app)
app.config["SECRET_KEY"] = 'secretkey'
app.config['MYSQL_HOST'] = 'localhost'
app.config['MYSQL_USER'] = ''
app.config['MYSQL_PASSWORD'] = ''
app.config['MYSQL_DB'] = ''

class CreateForm(FlaskForm):
    vcenter = SelectField("Category", coerce=str)
    datacenter = SelectField("Datacenter", coerce=str)


@app.route("/cat/<int:Vcenter>")
def category(Vcenter):
    c = mysql.connection.cursor()
    c.execute("""SELECT Datacenter, Datacenter FROM vsphere.test
                 WHERE Vcenter = ?""",
                 (Vcenter)
    )
    datacentercategories = c.fetchall()

    return jsonify(datacentercategories=datacentercategories)


@app.route('/')
def home():
    
    return render_template("home.html")

@app.route("/create-vm", methods=["GET","POST"])
def create():
    cur = mysql.connection.cursor()
    form = CreateForm()
    cur.execute("SELECT distinct Vcenter, Vcenter From vsphere.test")
    vcentercategories = cur.fetchall()
    form.vcenter.choices = vcentercategories
    
    
    cur.execute("SELECT distinct Datacenter, Datacenter From vsphere.test")
    datacentercategories = cur.fetchall()
    form.datacenter.choices = datacentercategories
    return render_template("create.html", form=form)


@app.route("/delete-vm", methods=["GET", "POST"])
def delete():
    return render_template("delete.html")


if __name__ == '__main__':
    app.run(debug=True, host='0.0.0.0')
My HTML code is as follows:

{% extends 'base.html' %}
{% set active_page = 'create' %}
{% block title %}Create VM - {% endblock %}

{% block content %}
<div class="row">
    <div class="col-lg-7 offset-lg-2 my-5">
      <h1>Delete Virtual Machine</h1><hr>
      <form method="POST" action="{{ url_for('create') }}">
       
        <div class="form-group">
          {{ form.vcenter.label }}
          {{ form.vcenter(class="form-control") }}
        </div>
        <div class="form-group">
          {{ form.datacenter.label }}
          {{ form.datacenter(class="form-control") }}
        </div>

        </form>
      </div>
{% endblock %}
{% block javascript %}
<script>
  $(function(){

    function subcategory_change(){
      var Vcenter = $("#vcenter").val();
      $.ajax({
        type: "GET",
        url: "/category/" + Vcenter
      }).done(function(data){
        $("#datacenter").empty();
        if($("#vcenter").hasClass("category-filter")){
          $("#datacenter").append(
            $("<option></option>").attr("value", "0").text(" --- ")
          );
        }
        $.each(data.datacentercategories, function(index, value){
          $("#datacenter").append(
            $("<option></option>").attr("value", value[0]).text(value[1])
          );
        });
      });
    }
    $("#vcenter").change(function(){
      subcategory_change();
    });
    subcategory_change();
  });
</script>
{% endblock %}
Reply


Messages In This Thread
Flask SelectField using Ajax - by noah_f - Mar-23-2020, 04:03 PM

Possibly Related Threads…
Thread Author Replies Views Last Post
  Retrieve data from ajax pthon3 0 1,161 May-29-2022, 10:32 PM
Last Post: pthon3
  POST Reply to Ajax/jQuery (mostly an HTML question) gw1500se 5 2,608 Nov-18-2021, 02:44 PM
Last Post: gw1500se
  Scraping a dynamic data-table in python through AJAX request filozofo 1 3,823 Aug-14-2020, 10:13 AM
Last Post: kashcode
  Ajax and Selenium ankitjindalbti 3 3,278 May-31-2019, 03:40 PM
Last Post: ankitjindalbti
  AJAX: readyState not as expected pleriche 2 3,371 Aug-08-2017, 08:55 AM
Last Post: pleriche

Forum Jump:

User Panel Messages

Announcements
Announcement #1 8/1/2020
Announcement #2 8/2/2020
Announcement #3 8/6/2020