[AF] Trouble with Flask and using ajax to dynamically refresh
I'm very new to this so I'm really unsure why this doesn't work as I was following the answer to [this question](https://stackoverflow.com/questions/15721679/update-and-render-a-value-from-flask-periodically/). I'm trying to post a form to flask where I process it as needed. This part works fine but when I'm trying to return it back to my html file I notice the $.getJSON part simply doesn't run. Any help or advice is appreciated.
The form part in my index.html:
<!-- POST Form -->
<form action='/endpoint' name="entry" id="entry" method="POST" target="_blank">
<textarea placeholder="Enter Cipher..." id="input" type="text" name="entry" class="inputbox">{{original_text}}</textarea>
<br />
<br />
<input type="submit" class="form__button" value="DECRYPT" onclick="decrypt_click()" />
<br />
<br />
</form>
<textarea id="output" type="text" name="output" class="inputbox" readonly>{{deciphered_text}}</textarea>
Javascript in my html file:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script type="text/javascript">
function update_values() {
$SCRIPT_ROOT = {{ request.script_root|tojson|safe }};
$.getJSON(
$SCRIPT_ROOT+"/endpoint",
function(data) {
$("textarea#output").val(data.deciphered_text)
$("textarea#entry").val(data.deciphered_text)
}
);
setTimeout(update_values, 1000);
}
update_values()
</script>
My ____init____.py:
from flask import Flask, render_template, request, jsonify, redirect, url_for
import sys
app = Flask(__name__)
from FlaskApp.autocrack import crack_vigenere, crack_caesar, crack_substitution, crack_beaufort, crack_2x2hill, crack_3x3hill, crack_bifid
import re
@app.route('/')
def homepage():
return render_template('index.html',deciphered_text="",original_text="",checkbox_status="1")
@app.route('/endpoint', methods=['GET','POST'])
def entry():
if request.method == 'POST':
text_orig = request.form['entry']
text = removeFormatting(text_orig)
cipher = request.form.get('cipher_selection_menu')
cipher = request.form['selection']
if text != "":
processed_text = text.upper()
if cipher == "1":
deciphered_text = crack_caesar(processed_text)
elif cipher == "2":
deciphered_text = crack_vigenere(processed_text)
elif cipher == "3":
timeout = request.form['timeout_slider']
deciphered_text = crack_substitution(processed_text,timeout)
elif cipher == "4":
deciphered_text = crack_beaufort(processed_text)
elif cipher == "5":
type = request.form['selector']
if type == "2":
deciphered_text = crack_2x2hill(processed_text)
elif type == "3":
deciphered_text = crack_3x3hill(processed_text)
elif cipher == "6":
deciphered_text = crack_bifid(processed_text)
return jsonify(deciphered_text=deciphered_text,original_text=text_orig)
return redirect(url_for('homepage'))
def removeFormatting(stringf):
return re.sub("[^a-zA-Z]+", "", stringf)
if __name__ == "__main__":
#app.run()
app.run(threaded=True)
/r/flask
https://redd.it/8pn4uu
I'm very new to this so I'm really unsure why this doesn't work as I was following the answer to [this question](https://stackoverflow.com/questions/15721679/update-and-render-a-value-from-flask-periodically/). I'm trying to post a form to flask where I process it as needed. This part works fine but when I'm trying to return it back to my html file I notice the $.getJSON part simply doesn't run. Any help or advice is appreciated.
The form part in my index.html:
<!-- POST Form -->
<form action='/endpoint' name="entry" id="entry" method="POST" target="_blank">
<textarea placeholder="Enter Cipher..." id="input" type="text" name="entry" class="inputbox">{{original_text}}</textarea>
<br />
<br />
<input type="submit" class="form__button" value="DECRYPT" onclick="decrypt_click()" />
<br />
<br />
</form>
<textarea id="output" type="text" name="output" class="inputbox" readonly>{{deciphered_text}}</textarea>
Javascript in my html file:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script type="text/javascript">
function update_values() {
$SCRIPT_ROOT = {{ request.script_root|tojson|safe }};
$.getJSON(
$SCRIPT_ROOT+"/endpoint",
function(data) {
$("textarea#output").val(data.deciphered_text)
$("textarea#entry").val(data.deciphered_text)
}
);
setTimeout(update_values, 1000);
}
update_values()
</script>
My ____init____.py:
from flask import Flask, render_template, request, jsonify, redirect, url_for
import sys
app = Flask(__name__)
from FlaskApp.autocrack import crack_vigenere, crack_caesar, crack_substitution, crack_beaufort, crack_2x2hill, crack_3x3hill, crack_bifid
import re
@app.route('/')
def homepage():
return render_template('index.html',deciphered_text="",original_text="",checkbox_status="1")
@app.route('/endpoint', methods=['GET','POST'])
def entry():
if request.method == 'POST':
text_orig = request.form['entry']
text = removeFormatting(text_orig)
cipher = request.form.get('cipher_selection_menu')
cipher = request.form['selection']
if text != "":
processed_text = text.upper()
if cipher == "1":
deciphered_text = crack_caesar(processed_text)
elif cipher == "2":
deciphered_text = crack_vigenere(processed_text)
elif cipher == "3":
timeout = request.form['timeout_slider']
deciphered_text = crack_substitution(processed_text,timeout)
elif cipher == "4":
deciphered_text = crack_beaufort(processed_text)
elif cipher == "5":
type = request.form['selector']
if type == "2":
deciphered_text = crack_2x2hill(processed_text)
elif type == "3":
deciphered_text = crack_3x3hill(processed_text)
elif cipher == "6":
deciphered_text = crack_bifid(processed_text)
return jsonify(deciphered_text=deciphered_text,original_text=text_orig)
return redirect(url_for('homepage'))
def removeFormatting(stringf):
return re.sub("[^a-zA-Z]+", "", stringf)
if __name__ == "__main__":
#app.run()
app.run(threaded=True)
/r/flask
https://redd.it/8pn4uu
Stack Overflow
Update and render a value from Flask periodically
I want to display my CPU usage dynamically. I don't want to reload the page to see a new value. I know how to get the CPU usage in Python. Right now I render a template with the value. How can I
Building a todo app using Vue.js and Django as the backend (Django rest framework)
Hi!
I have created a video tutorial where you can learn to build a todo app using Vue.js and Django 3 as the backend. For the backend I have used Django Rest Framework to build the API.
The Vue.js app is standalone, so it's completely separated from the backend.
I would love to get some constructive feedback on the video (quality, content, etc).
You can find the video here:
[https://youtu.be/j5DKSvAB-Ww](https://youtu.be/j5DKSvAB-Ww)
/r/django
https://redd.it/i1499t
Hi!
I have created a video tutorial where you can learn to build a todo app using Vue.js and Django 3 as the backend. For the backend I have used Django Rest Framework to build the API.
The Vue.js app is standalone, so it's completely separated from the backend.
I would love to get some constructive feedback on the video (quality, content, etc).
You can find the video here:
[https://youtu.be/j5DKSvAB-Ww](https://youtu.be/j5DKSvAB-Ww)
/r/django
https://redd.it/i1499t
YouTube
Django and Vue Todo App Tutorial (Django Rest Framework / Vue CLI)
Building a todo app using Vue.js and Python Django 3 as the backend (Django rest framework)
In this Django and Vue.js tutorial we'll be building a simple todo app. This is a trivial thing to do when you know a programming language, but it's also a great…
In this Django and Vue.js tutorial we'll be building a simple todo app. This is a trivial thing to do when you know a programming language, but it's also a great…
Fast-Docker: Docker Tutorial, Cheatsheet, Sample Usage Scenarios (HowTos)
Containerize your Flask Application with Docker! Docker can be used to create portable applications and independent environments. Using Docker Containers, applications can easily run on Cloud Environments (AWS, GCP, Azure).
This repo aims to cover Docker details (Dockerfile, Image, Container, Commands, Volumes, Docker-Compose, Networks, Swarm, Stack) fastly, and possible example usage scenarios (HowTo: Applications) in a nutshell. Possible usage scenarios are aimed to update over time.
**Tutorial Link:** [**https://github.com/omerbsezer/Fast-Docker**](https://github.com/omerbsezer/Fast-Docker)
Quick Look (HowTo)
* [App: Python App - Flask: Creating First Docker Image and Container using Docker File](https://github.com/omerbsezer/Fast-Docker/blob/main/FirstImageFirstContainer.md)
* [App: Binding Volume to the Different Containers](https://github.com/omerbsezer/Fast-Docker/blob/main/DockerVolume.md)
* [App: Binding Mount to the Container](https://github.com/omerbsezer/Fast-Docker/blob/main/DockerVolume.md#app_mount)
* [App: Docker-Compose File - Creating 2 Different Containers: WordPress Container depends on MySql Container](https://github.com/omerbsezer/Fast-Docker/blob/main/DockerCompose.md)
* [App: Creating Docker Swarm Cluster With 5 PCs using PlayWithDocker : 3 x WordPress Containers and 1 x MySql Container using Docker-Compose File](https://github.com/omerbsezer/Fast-Docker/blob/main/DockerStackService.md)
* [App: Running Docker Free Local Registry, Tagging Image, Pushing Image to the Local Registry, Pulling Image From Local Registry and Deleting Images from Local Registry](https://github.com/omerbsezer/Fast-Docker/blob/main/DockerLocalRegistry.md)
* [App: Transferring Content between Host PC and Docker Container](https://github.com/omerbsezer/Fast-Docker/blob/main/DockerTransferringContent.md)
* [Docker Commands Cheatsheet](https://github.com/omerbsezer/Fast-Docker/blob/main/DockerCommandCheatSheet.md)
Table of Contents
* [Motivation](https://github.com/omerbsezer/Fast-Docker#motivation)
* [Needs](https://github.com/omerbsezer/Fast-Docker#needs)
* [Benefits](https://github.com/omerbsezer/Fast-Docker#benefits)
* [Problems Docker does not solve](https://github.com/omerbsezer/Fast-Docker#problems)
* [What is Docker?](https://github.com/omerbsezer/Fast-Docker#whatIsDocker)
* [Architecture](https://github.com/omerbsezer/Fast-Docker#architecture)
* [Installation](https://github.com/omerbsezer/Fast-Docker#installation)
/r/flask
https://redd.it/mm6ijb
Containerize your Flask Application with Docker! Docker can be used to create portable applications and independent environments. Using Docker Containers, applications can easily run on Cloud Environments (AWS, GCP, Azure).
This repo aims to cover Docker details (Dockerfile, Image, Container, Commands, Volumes, Docker-Compose, Networks, Swarm, Stack) fastly, and possible example usage scenarios (HowTo: Applications) in a nutshell. Possible usage scenarios are aimed to update over time.
**Tutorial Link:** [**https://github.com/omerbsezer/Fast-Docker**](https://github.com/omerbsezer/Fast-Docker)
Quick Look (HowTo)
* [App: Python App - Flask: Creating First Docker Image and Container using Docker File](https://github.com/omerbsezer/Fast-Docker/blob/main/FirstImageFirstContainer.md)
* [App: Binding Volume to the Different Containers](https://github.com/omerbsezer/Fast-Docker/blob/main/DockerVolume.md)
* [App: Binding Mount to the Container](https://github.com/omerbsezer/Fast-Docker/blob/main/DockerVolume.md#app_mount)
* [App: Docker-Compose File - Creating 2 Different Containers: WordPress Container depends on MySql Container](https://github.com/omerbsezer/Fast-Docker/blob/main/DockerCompose.md)
* [App: Creating Docker Swarm Cluster With 5 PCs using PlayWithDocker : 3 x WordPress Containers and 1 x MySql Container using Docker-Compose File](https://github.com/omerbsezer/Fast-Docker/blob/main/DockerStackService.md)
* [App: Running Docker Free Local Registry, Tagging Image, Pushing Image to the Local Registry, Pulling Image From Local Registry and Deleting Images from Local Registry](https://github.com/omerbsezer/Fast-Docker/blob/main/DockerLocalRegistry.md)
* [App: Transferring Content between Host PC and Docker Container](https://github.com/omerbsezer/Fast-Docker/blob/main/DockerTransferringContent.md)
* [Docker Commands Cheatsheet](https://github.com/omerbsezer/Fast-Docker/blob/main/DockerCommandCheatSheet.md)
Table of Contents
* [Motivation](https://github.com/omerbsezer/Fast-Docker#motivation)
* [Needs](https://github.com/omerbsezer/Fast-Docker#needs)
* [Benefits](https://github.com/omerbsezer/Fast-Docker#benefits)
* [Problems Docker does not solve](https://github.com/omerbsezer/Fast-Docker#problems)
* [What is Docker?](https://github.com/omerbsezer/Fast-Docker#whatIsDocker)
* [Architecture](https://github.com/omerbsezer/Fast-Docker#architecture)
* [Installation](https://github.com/omerbsezer/Fast-Docker#installation)
/r/flask
https://redd.it/mm6ijb
GitHub
omerbsezer/Fast-Docker
This repo covers containerization and Docker Environment: Docker File, Image, Container, Commands, Volumes, Networks, Swarm, Stack, Service, possible scenarios. - omerbsezer/Fast-Docker
Fast-Docker: Docker Tutorial, Cheatsheet, Sample Usage Scenarios (HowTos)
Containerize your Django Application with Docker! Docker can be used to create portable applications and independent environments. Using Docker Containers, applications can easily run on Cloud Environments (AWS, GCP, Azure).
This repo aims to cover Docker details (Dockerfile, Image, Container, Commands, Volumes, Docker-Compose, Networks, Swarm, Stack) fastly, and possible example usage scenarios (HowTo: Applications) in a nutshell. Possible usage scenarios are aimed to update over time.
**Tutorial Link:** [**https://github.com/omerbsezer/Fast-Docker**](https://github.com/omerbsezer/Fast-Docker)
Quick Look (HowTo)
* [App: Python App - Flask: Creating First Docker Image and Container using Docker File](https://github.com/omerbsezer/Fast-Docker/blob/main/FirstImageFirstContainer.md)
* [App: Binding Volume to the Different Containers](https://github.com/omerbsezer/Fast-Docker/blob/main/DockerVolume.md)
* [App: Binding Mount to the Container](https://github.com/omerbsezer/Fast-Docker/blob/main/DockerVolume.md#app_mount)
* [App: Docker-Compose File - Creating 2 Different Containers: WordPress Container depends on MySql Container](https://github.com/omerbsezer/Fast-Docker/blob/main/DockerCompose.md)
* [App: Creating Docker Swarm Cluster With 5 PCs using PlayWithDocker : 3 x WordPress Containers and 1 x MySql Container using Docker-Compose File](https://github.com/omerbsezer/Fast-Docker/blob/main/DockerStackService.md)
* [App: Running Docker Free Local Registry, Tagging Image, Pushing Image to the Local Registry, Pulling Image From Local Registry and Deleting Images from Local Registry](https://github.com/omerbsezer/Fast-Docker/blob/main/DockerLocalRegistry.md)
* [App: Transferring Content between Host PC and Docker Container](https://github.com/omerbsezer/Fast-Docker/blob/main/DockerTransferringContent.md)
* [Docker Commands Cheatsheet](https://github.com/omerbsezer/Fast-Docker/blob/main/DockerCommandCheatSheet.md)
Table of Contents
* [Motivation](https://github.com/omerbsezer/Fast-Docker#motivation)
* [Needs](https://github.com/omerbsezer/Fast-Docker#needs)
* [Benefits](https://github.com/omerbsezer/Fast-Docker#benefits)
* [Problems Docker does not solve](https://github.com/omerbsezer/Fast-Docker#problems)
* [What is Docker?](https://github.com/omerbsezer/Fast-Docker#whatIsDocker)
* [Architecture](https://github.com/omerbsezer/Fast-Docker#architecture)
* [Installation](https://github.com/omerbsezer/Fast-Docker#installation)
/r/django
https://redd.it/mmd7xx
Containerize your Django Application with Docker! Docker can be used to create portable applications and independent environments. Using Docker Containers, applications can easily run on Cloud Environments (AWS, GCP, Azure).
This repo aims to cover Docker details (Dockerfile, Image, Container, Commands, Volumes, Docker-Compose, Networks, Swarm, Stack) fastly, and possible example usage scenarios (HowTo: Applications) in a nutshell. Possible usage scenarios are aimed to update over time.
**Tutorial Link:** [**https://github.com/omerbsezer/Fast-Docker**](https://github.com/omerbsezer/Fast-Docker)
Quick Look (HowTo)
* [App: Python App - Flask: Creating First Docker Image and Container using Docker File](https://github.com/omerbsezer/Fast-Docker/blob/main/FirstImageFirstContainer.md)
* [App: Binding Volume to the Different Containers](https://github.com/omerbsezer/Fast-Docker/blob/main/DockerVolume.md)
* [App: Binding Mount to the Container](https://github.com/omerbsezer/Fast-Docker/blob/main/DockerVolume.md#app_mount)
* [App: Docker-Compose File - Creating 2 Different Containers: WordPress Container depends on MySql Container](https://github.com/omerbsezer/Fast-Docker/blob/main/DockerCompose.md)
* [App: Creating Docker Swarm Cluster With 5 PCs using PlayWithDocker : 3 x WordPress Containers and 1 x MySql Container using Docker-Compose File](https://github.com/omerbsezer/Fast-Docker/blob/main/DockerStackService.md)
* [App: Running Docker Free Local Registry, Tagging Image, Pushing Image to the Local Registry, Pulling Image From Local Registry and Deleting Images from Local Registry](https://github.com/omerbsezer/Fast-Docker/blob/main/DockerLocalRegistry.md)
* [App: Transferring Content between Host PC and Docker Container](https://github.com/omerbsezer/Fast-Docker/blob/main/DockerTransferringContent.md)
* [Docker Commands Cheatsheet](https://github.com/omerbsezer/Fast-Docker/blob/main/DockerCommandCheatSheet.md)
Table of Contents
* [Motivation](https://github.com/omerbsezer/Fast-Docker#motivation)
* [Needs](https://github.com/omerbsezer/Fast-Docker#needs)
* [Benefits](https://github.com/omerbsezer/Fast-Docker#benefits)
* [Problems Docker does not solve](https://github.com/omerbsezer/Fast-Docker#problems)
* [What is Docker?](https://github.com/omerbsezer/Fast-Docker#whatIsDocker)
* [Architecture](https://github.com/omerbsezer/Fast-Docker#architecture)
* [Installation](https://github.com/omerbsezer/Fast-Docker#installation)
/r/django
https://redd.it/mmd7xx
GitHub
omerbsezer/Fast-Docker
This repo covers containerization and Docker Environment: Docker File, Image, Container, Commands, Volumes, Networks, Swarm, Stack, Service, possible scenarios. - omerbsezer/Fast-Docker
flask problem
I'm currently learning flask and encountered this problem. I want to get the errors I get when I submit my form and show it on my webpage but it doesn't work for me. please help a brother. this is the code
\#app.py
from flask import Flask, render_template, redirect, url_for, flash
from flask_wtf import FlaskForm
from wtforms import StringField, PasswordField, SubmitField
from wtforms.validators import DataRequired, Length, EqualTo
​
app = Flask(__name__)
app.config['SECRET_KEY'\] = 'your_secret_key'
​
class RegistrationForm(FlaskForm):
username = StringField('Username', validators=[DataRequired(), Length(min=4, max=20)\])
password = PasswordField('Password', validators=[DataRequired(), Length(min=6)\])
confirm_password = PasswordField('Confirm Password', validators=[DataRequired(), EqualTo('password')\])
submit = SubmitField('Register')
​
u/app.route('/register', methods=['GET', 'POST'\])
def register():
form = RegistrationForm()
if form.validate_on_submit():
\# Registration logic here (e.g., store data in a database)
flash(f'Account created for {form.username.data}!', 'success')
return redirect(url_for('register'))
return render_template('register.html', form=form)
​
\#html file
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Registration Form</title>
</head>
<body>
<h1>Register</h1>
<form method="POST" action="">
{{ form.hidden_tag() }}
<div>
{{ form.username.label }}<br>
{{ form.username(size=32) }}<br>
{% for error in form.username.errors %}
<span style="color: red;">{{ error }}</span><br>
{% endfor %}
</div>
<div>
{{ form.password.label }}<br>
{{ form.password(size=32) }}<br>
{% for error in form.password.errors %}
<span style="color: red;">{{ error }}</span><br>
{% endfor %}
</div>
<div>
{{ form.confirm_password.label }}<br>
{{ form.confirm_password(size=32) }}<br>
{% for error in form.confirm_password.errors %}
<span style="color: red;">{{ error }}</span><br>
{% endfor %}
</div>
<div>
{{ form.submit() }}
</div>
</form>
</body>
</html>
Please what
/r/flask
https://redd.it/17a907i
I'm currently learning flask and encountered this problem. I want to get the errors I get when I submit my form and show it on my webpage but it doesn't work for me. please help a brother. this is the code
\#app.py
from flask import Flask, render_template, redirect, url_for, flash
from flask_wtf import FlaskForm
from wtforms import StringField, PasswordField, SubmitField
from wtforms.validators import DataRequired, Length, EqualTo
​
app = Flask(__name__)
app.config['SECRET_KEY'\] = 'your_secret_key'
​
class RegistrationForm(FlaskForm):
username = StringField('Username', validators=[DataRequired(), Length(min=4, max=20)\])
password = PasswordField('Password', validators=[DataRequired(), Length(min=6)\])
confirm_password = PasswordField('Confirm Password', validators=[DataRequired(), EqualTo('password')\])
submit = SubmitField('Register')
​
u/app.route('/register', methods=['GET', 'POST'\])
def register():
form = RegistrationForm()
if form.validate_on_submit():
\# Registration logic here (e.g., store data in a database)
flash(f'Account created for {form.username.data}!', 'success')
return redirect(url_for('register'))
return render_template('register.html', form=form)
​
\#html file
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Registration Form</title>
</head>
<body>
<h1>Register</h1>
<form method="POST" action="">
{{ form.hidden_tag() }}
<div>
{{ form.username.label }}<br>
{{ form.username(size=32) }}<br>
{% for error in form.username.errors %}
<span style="color: red;">{{ error }}</span><br>
{% endfor %}
</div>
<div>
{{ form.password.label }}<br>
{{ form.password(size=32) }}<br>
{% for error in form.password.errors %}
<span style="color: red;">{{ error }}</span><br>
{% endfor %}
</div>
<div>
{{ form.confirm_password.label }}<br>
{{ form.confirm_password(size=32) }}<br>
{% for error in form.confirm_password.errors %}
<span style="color: red;">{{ error }}</span><br>
{% endfor %}
</div>
<div>
{{ form.submit() }}
</div>
</form>
</body>
</html>
Please what
/r/flask
https://redd.it/17a907i