How to pass bootstrap modal input data from HTML to Python Flask - python

I have a modal popup that allows users to input data. I want to pass that data to Flask so that I can put it in my database. For some reason, no data is being passed. I am printing out request.form and it logs "ImmutableMultiDict([])", when it should contain my form's inputs. I have been trying to use POST, but I'm open to other ideas. This is happening on Heroku, I haven't tested it locally.
HTML
<!-- Modal -->
<div class="modal fade" id="newProjectModal" tabindex="-1" aria-labelledby="newProjectModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="newProjectModalLabel">Create Project</h5>
<button type="button" class="btn-close" aria-label="Close"></button>
</div>
<form action="/createproject/" name="createProjectForm" id="createProjectForm" method="POST">
<div class="modal-body">
<div class="mb-3">
<label for="projectNameInput" class="form-label">Project Name</label>
<input type="text" class="form-control" id="projectNameInput" name="projectName" placeholder="New Project">
</div>
<div class="mb-3">
<label for="projectDescriptionInput" class="form-label">Project Description</label>
<textarea class="form-control" id="projectDescriptionInput" name="projectDescription" rows="3"></textarea>
</div>
<label for="selectUsersInput" class="form-label">Assign Personnel</label>
<select class="form-select" id="selectUsersInput" name="selectUsers" multiple aria-label="multiple select example">
{% for user in users %}
<option value="{{ user }}">{{ user }}</option>
{% endfor %}
</select>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary">Close</button>
<button class="btn btn-primary" type="submit" name="submit" value="Submit">Create Project</button>
</div>
</tr>
</form>
</div>
</div>
</div>
Python
#app.route('/createproject/', methods=['POST'])
def createproject():
if request.method == 'POST':
print(request.form)
project_name = request.form.get('projectName')
project_description = request.form.get('projectDescription')
return '''
<h1>The name value is: {}</h1>
<h1>The description value is: {}</h1>'''.format(project_name, project_description)
project_name and project_description are always "None" instead of the entered value

Related

The view function for 'authen.delete_tracker' did not return a valid response. The function either returned None or ended without a return statement [duplicate]

This question already has answers here:
Flask view return error "View function did not return a response"
(3 answers)
Closed 8 months ago.
flask code
#bp.route('/delete/<int:id>')
#login_required
def delete_tracker(id):
if Trackers.user_id == current_user.id:
trackers = Trackers.query.filter_by(id=id).first()
print(trackers)
db.session.delete(trackers)
db.session.commit()
return redirect(url_for("authen.dashboard"))
Html code- look for /delete url t bottom there is the error
{% extends "base.html" %}
{% block title %} Dashboard {% endblock %}
{% block content %}
<nav class="sidenav">
<div class="main-buttons">
<a class="nav-link active" id="trackers" aria-current="page" href="/dashboard">Trackers</a>
<a class="nav-link active" id="goals" aria-current="page" href="/goals">Goals</a>
<div>
</nav>
<div id="dashbar">
<nav class="navbar bg-light">
<div class="container-fluid">
<button type="button" class="btn btn-outline-dark" data-bs-toggle="modal" data-bs-target="#exampleModal">
Add Tracker
</button>
<form method="POST">
<div class="modal fade" id="exampleModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Add a Tracker</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<label for="tracker_name" class="col-form-label">Tracker Name:</label>
<input type="text" class="form-control" id="tracker_name" name="tracker_name"
placeholder="Enter a Tracker name">
<div class="from-fieldset" style="width:200px;">
<label for="tracker_type" class="form-label">Choose a Tracker type:</label>
<select id="tracker_type" name="tracker_type">
<option value="">choose Tracker type</option>
{% for t in data_trackers %}
<option value="{{t.name}}">{{t.name}}</option>
{% endfor %}
<label for="tracker_description " class="col-form-label">Description</label>
<input type="text" class="form-control" id="tracker_description" name="tracker_description"
placeholder="Enter Description">
</select>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
<button type="submit" class="btn btn-light border-dark">Submit</button>
</div>
</div>
</div>
</div>
</form>
<form class="d-flex" role="search">
<input class="form-control me-2" type="search" placeholder="Search" aria-label="Search">
<button class="btn btn-outline-success" type="submit">Search</button>
</form>
</div>
</nav>
</div>
<div class="wrapper">
<div class="container-tracker">
{% for track in user.trackers %}
<div class="tra">
<h3 id="trackername"> {{track.tracker_name}}</h3>
<div class="dropdown-container" tabindex="-1">
<form method="GET" action="/delete/{{track.id}}">
<button type="submit" class="btn btn-outline-light">Delete</button>
</form>
<div class="three-dots"></div>
<div class="dropdown">
<a href="#">
<div>Records and Graphs</div>
</a>
</div>
</div>
</div>
{% endfor %}
</div>
</div>
{% endblock %}
( in form method=GET , the delete url is there and the flask code is at top for that endpoint
if I remove if condition in the delete_tracker() fucntion that is if user.id==current_user.id then I will get a different error that is , this is for session 2nd but this is 3rd session something like this, so my file I want to delete is different session )
can you try to change your line
#bp.route('/delete/<int:id>')
to
#bp.route('/delete/<track.id>')

Django - Embed python inside HTML to trigger two form actions

All I want to do is to have a condition in order when the user clicks FOR SALE button to be redirected to url 'salesearch' or when clicks TO RENT to be redirected to url 'rentsearch'.
Here's the code:
<div class="search">
<form action="{% url 'salesearch' %}">
<div class="form-row">
<div class="col-md-4 mb-3">
<label class="sr-only">
Keywords
</label>
<input class="form-control" name="keywords" placeholder="Keyword (Pool, Garage, etc)" type="text">
</div>
<div class="col-md-4 mb-3">
<label class="sr-only">
City
</label>
<input class="form-control" name="city" placeholder="City" type="text">
</div>
<div class="form-row">
<div class="col-md-6 mb-3">
<button class="btn btn-secondary btn-block mt-4" name="For Sale" type="submit">
For Sale
</button>
</div>
<div class="col-md-6 mb-3">
<button class="btn btn-secondary btn-block mt-4" name="To Rent" type="submit">
To Rent
</button>
</div>
</div>
</div>
</form>
</div>
With the above example I am redirected always at url 'salesearch path. Is there any way to have a conditional to determine the url's path?
Sure is!
You can set formaction on button elements:
<button name="For Sale" type="submit" formaction="{% url 'salesearch' %}">
For Sale
</button>
<button name="To Rent" type="submit" formaction="{% url 'rentsearch' %}">
To Rent
</button>

request.method getting defaulted to GET in Flask

I have created a form in Flask, and want to submit certain values which need to be processed.But the method used is getting defaulted to GET even though I have specified the method as post in my form
These are the the relevant code files:
app.py
#app.route('/test',methods=["GET","POST"])
def test():
print(request.method)
error = None
try:
if request.method == "POST":
first_name = request.form['firstname']
last_name = request.form['lastname']
flash(first_name)
flash(last_name)
return render_template("test.html")
else:
return "Wrong"
except Exception as e:
return str(e)
test.html
<form method="post" class="text-center" style="color: #757575;" action="">
<div class="form-row">
<div class="col">
<!-- First name -->
<div class="md-form">
<input type="text" name="firstname" value="{{request.form.firstname}}" class="form-control">
<label for="materialRegisterFormFirstName">First name</label>
</div>
</div>
<div class="col">
<!-- Last name -->
<div class="md-form">
<input type="text" name="lastname" value="{{request.form.lastname}}" class="form-control">
<label for="materialRegisterFormLastName">Last name</label>
</div>
</div>
</div>
<!-- File Upload -->
<div class="md-form">
<input type="file" id="fileupload" class="form-control">
</div>
<input class="btn btn-info btn-block" type="submit" value="Submit">
</form>
The method is getting defaulted to post and the response "Wrong" on loading 127.0.0.1:5000/test. The method is always GET
<form method="post" class="text-center" style="color: #757575;" action="/test" method="post">
<div class="form-row">
<div class="col">
<!-- First name -->
<div class="md-form">
<input type="text" name="firstname" value="{{request.form.firstname}}" class="form-control">
<label for="materialRegisterFormFirstName">First name</label>
</div>
</div>
<div class="col">
<!-- Last name -->
<div class="md-form">
<input type="text" name="lastname" value="{{request.form.lastname}}" class="form-control">
<label for="materialRegisterFormLastName">Last name</label>
</div>
</div>
</div>
<!-- File Upload -->
<div class="md-form">
<input type="file" id="fileupload" class="form-control">
</div>
<input class="btn btn-info btn-block" type="submit" value="Submit">
</form>
By adding the "route" to the action attribute and defining the method of submission of form, you can perform the desired objective.

Can't get inputs from html form

I want to create a webapp in Django that converts orders in pdf to excel file. To be more flexible i want to retrive text from pdf and pass it to form on HTML page to be editable. If everythig will be ok then i want to download excel file with data from inputs.
There is several inputs (depending on how much rows is in pdf with order) and i want to pass it all to my app. But below code dont work. Only result i have is token and value from button.
print(request.POST.keys())
print(request.POST['Submit'])
print(request.body)
<form action="extract_pdf" method="post">
{% csrf_token %}
<div class="row">
<div class="col-sm">
<div class="input-group mb-3">
<div class="input-group-prepend">
<label class="input-group-text" for="inputGroupSelect01">Company ID</label>
</div>
<select class="custom-select" id="inputGroupSelect01">
{% for item in company %}
<option value="a">{{item.1}}</option>
{% endfor %}
</select>
</div>
</div>
<div class="col-sm">
<div class="input-group mb-3">
<div class="input-group-prepend">
<span class="input-group-text" id="company_name">Company Name</span>
</div>
<input type="text" class="form-control" id="name" aria-describedby="basic-addon3" value="{{info.company_name}}">
</div>
</div>
<div class="col-sm">
<div class="input-group mb-3">
<div class="input-group-prepend">
<span class="input-group-text" id="order_no">Order Number</span>
</div>
<input type="text" class="form-control" id="ord_no" aria-describedby="basic-addon3" value="{{info.order_number}}">
</div>
</div>
</div>
{% for row in rows %}
<div class="row">
<div class="col-sm">
<div class="input-group mb-3">
<div class="input-group-prepend">
<span class="input-group-text" id="item_nr">Jeeves Code</span>
</div>
<input type="text" class="form-control" id="item" aria-describedby="basic-addon3" value="{{row.item}}">
</div>
</div>
<div class="col-sm">
<div class="input-group mb-3">
<div class="input-group-prepend">
<span class="input-group-text" id="item_qty">Item Qty</span>
</div>
<input type="text" class="form-control" id="qty" aria-describedby="basic-addon3" value="{{row.qty}}">
</div>
</div>
<div class="col-sm">
<div class="input-group mb-3">
<div class="input-group-prepend">
<span class="input-group-text" id="item_price">Item price</span>
</div>
<input type="text" class="form-control" id="price" aria-describedby="basic-addon3" value="{{row.price}}">
</div>
</div>
</div>
{% endfor %}
<input type="submit" class="btn btn-success" value="Download" name="Submit" />
</form>
Please help me find bug in my code :)
You need to name your inputs. request.POST is a dictionary of key value pairs from the POST data, and if you do not provide names for the inputs there is no way for django to build that relationship and give you the data in your request.POST. Hope this helps!

form in modal action not doing anything

This is some code from my index.html. My issue is that the action on the form in the modal is not working (no error, just doing nothing) yet the form outside the model is working fine (commented test button). The model is opening fine and seems correctly formatted, yet the 'yes' button does nothing but closes the modal. The problem does not seem to be in the URL. Any help would be much appreciated. I am using django by the way
{% for patient in all_patients %}
<div class="col-lg-12">
<div class="panel panel-default">
<div class="panel-body">
<!-- Name -->
<h4>{{ patient }}</h4>
<!-- View Details -->
View Details
<!-- Edit Details -->
Edit Details
<!-- Delete Patient -->
<input type="hidden" name="patient_id" value="{{ patient.id }}" />
<button type="submit" class="btn btn-default btn-sm" data-toggle="modal" data-target="#patient_id">
<span class="glyphicon glyphicon-trash"></span>
</button>
<!-- Modal -->
<div class="modal fade" id="patient_id" role="dialog">
<div class="modal-dialog">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">Confirm delete</h4>
</div>
<div class="modal-body">
<p>Are you sure you want to delete {{ patient }}?</p>
</div>
<div class="modal-footer">
<button type="submit" class="btn btn-default" data-dismiss="modal">No</button>
<form action="{% url 'patients:patient-delete' patient.id %}" method="post" style="display: inline;">
{% csrf_token %}
<button type="submit" class="btn btn-danger" data-dismiss="modal">Yes</button>
</form>
</div>
</div>
</div>
</div>
<!-- test button -->
<form action="{% url 'patients:patient-delete' patient.id %}" method="post" style="display: inline;">
{% csrf_token %}
<button type="submit" class="btn btn-danger" data-dismiss="modal">Delete</button>
</form>
</div>
</div>
</div>
{% cycle '' '' '' '' '' '<div class="clearfix visible-lg"></div>' %}
{% endfor %}

Categories

Resources