How to add a button in email input? - python

I am trying to put a button inside an email input in a Django form.
This is the code with the button next to the email input:
<div class="container" id="notifyEmailFormContainer">
<form action="{% url "landing:notify_email_add" %}" method="post" id="notifyEmailForm">
{% csrf_token %}
<div class="form-group row">
<div class="col-sm-10 input-group" id="emailInput">
<div class="input-group-addon" id="comingSoonEmailIcon"><i class="fa fa-envelope fa fa-2x" aria-hidden="true"></i></div>
<input class="form-control" type="email" name="email" placeholder="Your email...." maxlength="255" required id="id_email"/>
</div>
<div class="col-sm-2">
<button type="button" class="btn btn-block btn-primary" onclick="addNotifyEmail()" id="submitNotifyEmail">Notify Me</button>
</div>
</div>
</form>
</div>
I have a tried a couple answers in similar questions but it seems I can't get it to work.

Related

Receive array from HTML form in FastAPI

I'm trying to submit a form through post in FastAPI and get a form variable that is stored as a list. When I read back the value all I get is an empty list. There are several variables that will eventually be in list form but all I am trying to get at the moment is the array that holds the quantity values.
What am I doing wrong?
Here is my code:
Python Code
#app.post("/edit_bom")
def edit_bom(board_id: int = Form(...), quantity: list = Form(...)):
print("Editting BOM, board ID: " + str(board_id))
print("quantity: ", quantity)
return RedirectResponse(url=f"/get_bom_details/" + str(board_id), status_code=303)
HTML Code
<form method="post" action="/edit_bom" id="parent-form">
<div class="mb-3 row">
<div class="d-grid gap-2 col-2">
<button type="button" class="btn btn-outline-primary add-one-more"><i class="fas fa-fw fa-plus-square"></i> New Row</button>
</div>
<div class="d-grid gap-2 col-2">
<button type="submit" name="action" value="save-bom" class="btn btn-outline-success"><i class="fas fa-fw fa-check"></i> Save</button>
</div>
</div>
<div class="mb-3 row" id="header">
<label class="col-form-label col-sm-1 text-sm-end"></label>
<div class="col-sm-7">
<h3>Part Number</h3>
</div>
<div class="col-sm-2">
<h3>Quantity</h3>
</div>
<div class="input-group col">
<h3>Edit</h3>
</div>
<div class="input-group col">
<h3>Delete</h3>
</div>
</div>
<div class="mb-3 row bom-line-item copy-fields" id="entry">
<label class="col-form-label col-sm-1 text-sm-end child-row-label">1</label>
<div class="col-sm-7 child-outer">
<input type="text" name="part-name_1" id="0" class="form-control child-part-name" placeholder="Board Number" value="ISL73847SEHDEMO1ZB">
</div>
<div class="col-sm-2 child-outer">
<input type="number" name="quantity[]" id="0" class="form-control child-part-quantity" placeholder="Enter quantity" value="1">
</div>
<div class="input-group col child-outer">
<button id="btn-edit_1" class="btn btn-primary child-btn-edit" type="button"><i class="fas fa-fw fa-edit"></i></button>
</div>
<div class="input-group col child-outer">
<button id="btn-del_1" class="btn btn-danger child-btn-delete" type="button"><i class="fas fa-fw fa-ban"></i></button>
</div>
</div>
<div class="end-of-list" name="noOfRows" value="1"></div>
<input type="hidden" name="board_id" value="1">
</form>
My output in the command prompt:
Editting BOM, board ID: 1
quantity: []
Using the comment from #MatsLindh
I had to change the HTML element name from "quantity[]" to "quantity" and it works now.

Modal window not called after button click

I'm making my first website, using Django, python and bootstrap 5, I want a person to click the "submit" button after filling out the form and after that a modal window pops up in which it would say that "everything is OK, your application has been created"
<div class="row mt-5 mb-5 p-2">
<form action="{% url 'feedback_view' %}" method="POST">
{% csrf_token %}
<div class="col-md-6 mb-2">
<label for="exampleInputName" class="form-label">Ваше Имя</label>
<input name="name" class="form-control" id="exampleInputName" aria-describedby="NameHelp">
</div>
<div class="col-md-6 mb-2">
<label for="exampleInputphone" class="form-label">Ваш Телефон</label>
<input name="phone" class="form-control" id="exampleInputphone" aria-describedby="NameHelp" placeholder="+7 (918) 000-00-00">
</div>
<button type="submit" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#exampleModal">send</button>
</form>
</div>
<button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#exampleModal">send_btn</button>
but for some reason the "send" button does not work, but the "send_btn" button works, which I made to check the problem. all I understand at the moment is what bothers me, type="submit" because in the afternoon there is type="button". How can I solve this problem, given that this is a form submission button? this is the window code:
{% if messages %}
{% for message in messages %}
<div class="modal fade" id="exampleModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Modal title</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<p class="reviews">{{ message }}</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary">Save changes</button>
</div>
</div>
</div>
</div>
{% endfor %}
{% endif %}
it's views.py
class FeedBackView(View):
def post(self, request):
form = FeedBackForm(request.POST)
if form.is_valid():
form.save()
messages.add_message(request, settings.MY_INFO, 'now call you!')
else:
messages.add_message(request, settings.MY_INFO, 'something was wrong')
return redirect("/")

How to get/Fetch Form data in django using cloud firestore?

Form picture
ID is been selected but I'm not getting the values in the form, please check my code files. See in the picture in URL of the browser, update/id is selected, the problem is values are not fetched in the form.
HTML:
<form id="task-form" name="myForm">
{% csrf_token %}
<div class="form-group">
<div class="row">
<div class="col">
<input type="text" class="form-control" id="task-building" placeholder="Building name" name="building" value="{{buildings.building}}">
</div>
<div class="col">
<input type="text" class="form-control" id="task-postal" placeholder="Postal Code" name="postalCode" value="{{buildings.postalCode}}">
</div>
</div>
</div>
<div class="form-group">
<div class="row">
<div class="col">
<input type="text" class="form-control" id="task-town" placeholder="town" name="town" value="{{buildings.town}}">
</div>
<div class="col">
<input type="text" class="form-control" id="task-street" placeholder="Street" name="street" value="{{buildings.street}}">
</div>
</div>
</div>
<div class="form-group">
<div class="row">
<div class="col">
<input type="text" class="form-control" id="task-house" placeholder="House No." name="houseNo" value="{{buildings.houseNo}}">
</div>
<div class="col">
<input type="text" class="form-control" id="task-info" placeholder="Additional Information" name="additionalInfo" value="{{buildings.additionalInfo}}">
</div>
</div>
</div>
<div class="text-center mt-3">
<button type="submit" id="btn-task-form" class="btn btn-primary ">UPDATE</button>
</div>
</form>
views.py
def update_Building(request, id):
docId = id;
context = {
'buildings': db.collection('Buildings').document(docId).get()
}
return render(request,"EmployeeAdmin/updateBuilding.html", context)
urls.py
path('update/<str:id>/',views.update_Building,name='update_Building'),

Why am I getting Bad request error for my flask code? [duplicate]

This question already has answers here:
Post values from an HTML form and access them in a Flask view
(2 answers)
Closed 4 years ago.
I have a code like this. This is giving me 400 Bad request error. I found that there is only one form in the page from which the form is submitted.
#auth.route('/admin/project/add',methods = ['POST', 'GET'])
def addproject():
if request.method == 'POST':
projectname = request.form['projectname']
c, conn = connection()
query = "SELECT id from projects WHERE UPPER(project)='{}'".format(projectname)
c.execute(query)
value = c.fetchall
if value>0:
return render_template('addproject.html')
else:
flash("Project already exists. Please goto projects page and confirm. If it is and error, please contact devloper.")
return redirect(url_for('addproject'))
else:
return render_template('addproject.html')
I am also adding my HTML code for the form below. I tried a lot and is not able to figure out why I am keeping on getting that error. I also did small changes in my views.py,still the result is same.
<form action="/admin/project/add" id="myForm" method="POST" name="add">
<div class="form-body">
<div class="row p-t-20">
<div class="col-md-6">
<div class="form-group">
<label class="control-label">Project Name</label>
<input type="text" id="projectname" class="form-control" placeholder="Please enter project name" required >
</div>
</div>
<!--/span-->
<div class="col-md-6">
<div class="form-group has-danger">
<label class="control-label">Project Location</label>
<input type="text" id="projectlocation" class="form-control form-control-danger" placeholder="Please enter project location" required >
</div>
</div>
<!--/span-->
</div>
<!--/row-->
<div class="row">
<!--/span-->
<div class="col-md-6">
<div class="form-group">
<label class="control-label">Starting Date</label>
<input type="date" class="form-control" placeholder="dd/mm/yyyy" required >
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<label class="control-label">End Date</label>
<input type="date" class="form-control" placeholder="dd/mm/yyyy" required >
</div>
</div>
</div>
<div class="row">
<div class="col-md-6">
<div class="form-group has-danger">
<label class="control-label">Leader</label>
<input type="text" id="lead" class="form-control form-control-danger" placeholder="Please enter the leader for the project" required >
</div>
</div>
<div class="col-md-6">
<div class="form-group has-danger">
<label class="control-label">Current Status</label>
<select class="form-control" required>
<option value="">--Select--</option>
<option value="T">T</option>
<option value="D">D</option>
<option value="S">S</option>
</select>
</div>
</div>
</div>
<!--/span-->
<!--/span-->
</div>
<!--/row-->
<h5 class="box-title m-t-40">Project Description (optional)</h5>
<hr>
<div class="col-md-6">
<div class="form-group has-danger">
<TEXTAREA rows="8" cols="138"></TEXTAREA>
</div>
</div>
<!--/span-->
</div>
</div><div class="col-md-6">
<div class="form-actions">
<button type="submit" class="btn btn-success" name="add"> <i class="fa fa-plus" value="Add"></i> Add</button>
<button type="button" class="btn btn-inverse" onclick="viewproject();" name="cancel" value="Cancel">Cancel</button>
{% with messages = get_flashed_messages() %}
{% if messages %}
<ul>
{% for message in messages %}
<li<{{ message }}</li>
{% endfor %}
</ul>
{% endif %}
{% endwith %}
</div></div>
</form>
The answer to your question is in the addproject.html file and the way that sends the parameter.
To solve it check for mistakes in the name of the parameter ('projectname'). See if the name is the same in the addproject.html file.
Another common problem is set incorrectly the 'content-type'.
After you edit your question with the form code, I saw you are using input id instead input name in the form.
The correct way is:
<input type="text" name="projectname" ... >
I hope this helps!

Strange block/extends interaction going on in Django

so in my home page I extend from 2 things, based on whether or not the user is signed in or not. Then, if they have TRIED to sign in, and failed, i want the inputs to be red:
{% extends extendVar %} #in this case, extendvar=notLoggedIn.html
{% block signIn %}
{% if failure %}
<div class="form-group has-error">
<input type="email" id="email" name="email" placeholder="Email" class="form-control">
</div>
<div class="form-group has-error">
<input type="password" name="password" placeholder="Password" class="form-control">
</div>
{% endif %}
{% endblock %}
notLoggedIn.html then includes from a header page:
<div class="container" style="">
{% include 'header.html' %}
</div>
And this has a block tag:
<div class="header clearfix">
<nav>
<ul class="nav nav-pills pull-left">
<a class="" href="#">
<img alt="Brand" src="{% static 'images/Logo.png' %}" style="height:auto; max-width:470px; margin-top:-22px; margin-bottom:-30px; padding-right:10px;">
</a>
</ul>
<ul class="nav nav-pills pull-right">
<div id="navbar" class="navbar-collapse collapse">
<form class="navbar-form navbar-right" action="{% url 'signIn' %}" method="POST">
{% csrf_token %}
{% block signIn %}
<div class="form-group">
<input type="email" id="email" name="email" placeholder="Email" class="form-control">
</div>
<div class="form-group">
<input type="password" name="password" placeholder="Password" class="form-control">
</div>
<button class="btn btn-primary btn" href="" role="button" style="">Sign in </button>
{% endblock %}
</form>
</div>
</ul>
</nav>
Project name</h3> -->
my only problem is that because i am including header in NotLoggedIn, and then extending that, it doesnt preserve the block tags, and so the signIn blocks are not working. If instead of doing include header, i merely hard-code it, the blocks work perfectly. Any ideas?
According to the django documentation, when you use "include", blocks in the included template are evaluated first, and then substituted in. So in your template, you can't override a block of the included template.
https://docs.djangoproject.com/es/1.9/ref/templates/builtins/#include
Instead of using a block, what if you pass variables down to the include block, to get it to render how you want? For example:
Your template:
{% include 'header.html' with failure=failure %}
header.html:
<div class="form-group {% if failure %}has-error{% endif %}">
<input type="email" id="email" name="email" placeholder="Email" class="form-control">
</div>
<div class="form-group {% if failure %}has-error{% endif %}">
<input type="password" name="password" placeholder="Password" class="form-control">
</div>

Categories