Form not looking good without using crispy form - python

This is the form that appears if I donot use crsipy form.But, if I use crispy forms, the radio button disappears, anyone have any idea??
As shown above, if crispy form is used, the radio button now disapperas.what is the issue??
<form method="POST">
{% csrf_token %}
{{ form|crispy }}
<button type="submit" class="btn btn-success" formaction="{% url 'addcustomer' %}">Submit</button>
<button class="btn btn-primary" formaction="{% url 'customerlist' %}">Cancel</button>
</form>

Related

DJANGO - call view.py function with HTML button click

I want to be able to CRUD data from my django-db through the view.py.
{% extends 'home/base.html' %}
{% load crispy_forms_tags %}
{% block content %}
<form method="POST" action ="{% url 'twitter' %}" enctype="multipart/form-data">
{% csrf_token %}
<fieldset="form-group">
<legend class="border-bottom mb-4">Twitter Information</legend>
{{ tw|crispy }}
</fieldset>
<div class="form-group">
</form>
<div class="form-group">
<button class="btn btn-outline-info" type="submit">Submit</button>
<button class="btn btn-info" type="submit">Update</button>
<button class="btn btn-dark" type="reset">Reset</button>
Delete
</form>
{% endblock content %}
twitter_container.twitter-edit is a view in my view.py. I'm trying to call this function on button clicked.
In order to call a function in views.py with HTML button, you need to use AJAX in javascript.
Check this out for more info.

HTML Jinja2 disabling submit button in specific situation

I am having problem with setting up logic for if statement in HTML template with Jinja.
What should I input in place of ??? in the below code?
I don't want the user to be able to post empty field, therefore, I have decided to disable the submit button while the textarea is empty (e.g.: it has different css style with the form__submit__disabled class).
I have tried inputting in the ??? place content, entry, form__textarea, but it doesn't work.
<form class="form" action="/" method="POST">
<p class="form__input">
<textarea name="content" id="entry" class="form__textarea" aria-label="Entry contents" placeholder="Type here..."></textarea>
</p>
{% if ??? is none %}
<button type="submit" class="form__submit__disabled" disabled>Add entry</button>
{% else %}
<button type="submit" class="form__submit">Add entry</button>
{% endif %}
</form>
A better idea, for this requirement would be to use the required attribute of the textarea, and let the browser do the job of warning the end user that this field should be filled in before submitting.
<form class="form" action="/" method="POST">
<p class="form__input">
<textarea name="content"
id="entry"
class="form__textarea"
aria-label="Entry contents"
placeholder="Type here..."
required></textarea>
</p>
<button type="submit"
class="form__submit">
Add entry
</button>
</form>

Add item to dropdown without refresh

City is a (dropdown in a main form ) with a +(Add) button.
This +(Add) button opens another form in separate window.
On saving a new city in the second form, I want the new city name to be added in the City dropdown without refreshing the main form.
Here is my code.
<form method="POST" enctype="multipart/form-data" id="form">
{% csrf_token %}
<td>City: {{ form.city }}
<button class="btn btn-primary" onclick="addCity(event)">+</button>
</td>
<button type="submit" class="btn btn-primary">Save</button>
</form>
<script>
function addCity(e){
e.preventDefault();
window.open("/city/", "", "width=500,height=500");
}
</script>
city.html
<form method="POST" class="post-form" action="/city/" id="form">
{% csrf_token %}
<div class="container">
<div class="form-group row">
<label class="col-sm-2 col-form-label">City:</label>
<div class="col-sm-4">
{{ form.name }}
</div>
</div>
<button type="submit" class="btn btn-primary">Save</button>
</div>
</form>
urls.py
urlpatterns = [
path('city/', views.add_city, name='city_master'),
]
views.py
def add_city(request):
cities = City.objects.all()
if request.method == "POST":
form = CityForm(request.POST)
if form.is_valid():
try:
form.save()
return redirect('/city/')
except:
pass
else:
form = CityForm()
return render(request,'city.html',{'form':form})
I can not comment that is why i am writing here, Sir you need ajax call. Do not use POST request, for all post request the page reloads it self. so try using ajax, you can create a route and function inside controller.

Django : How to differentiate post requests from different pages that are coming to the same page?

I have two pages both containing form. However both the pages are sending post request to the same page. How do I differentiate which page has sent the request.
dummy.html(first page)
<form action="/nda" method='POST'>
{% csrf_token %}
<button type="submit" name="submit" id="submit" value="I Agree" target="_blank">I Agree</button>
<button onclick="window.open('/greeting')" target="_blank"> I Disagree </button></br>
</form>
This page redirects to nda page.
nda.html(second page)
This page also redirects to the same page.
<form action="/nda" method='POST'>
{% csrf_token %}
<button type="submit" name="submit" id="submit" value="I Agree" target="_self">I Agree</button>
<button onclick="window.open('/greeting')" target="_self"> I Disagree </button></br>
</form>
My question is, how do I differentiate in my view that from which page it was coming from the page dummy or the same page that was nda.
views.py
def nda(request):
if request.method=='POST' :
# if this is from dummy I want to do this
return render(request,'mainapp/nda.html',{'user':email.split('#')[0]})
if request.method=='POST' :
# if this is from same page that is nda I want to do this
return render(request,'mainapp/home.html')
I am unable to figure out, how do I handle both cases differently
If I understand your question properly,you can use the name attribute in your submit button
<button type="submit" name="submit1" id="submit" value="I Agree" target="_blank">I Agree</button
<button type="submit" name="submit2" id="submit" value="I Agree" target="_blank">I Agree</button
And in the views
def nda(request):
if request.method=='POST' and 'submit1' in request.POST :
# do something
return render(request,'mainapp/nda.html',{'user':email.split('#')[0]})
elif request.method=='POST' and 'submit2' in request.POST:
#do something else
...
How it works ?
You click on the submit button and the server is accessing ..
A button with type submit follows the "action" path specified in the form tag
That is, so that you have a request for different pages, you need to create an additional url, views and html
Example:
one_html.html
<form action="{% url your_app:name1 %}" method='POST'>
{% csrf_token %}
<button type="submit" name="submit" id="submit" value="I Agree" target="_blank">I Agree</button>
<button onclick="window.open('/greeting')" target="_blank"> I Disagree </button></br>
</form>
urls.py:
...
url(r'^' + app_name + 'some_path', views_one, name='name1'),
views.py:
def views_one(request):
if request.method=='POST':
# do something
Exapmle:
two_html.html
<form action="{% url your_app:name2 %}" method='POST'>
{% csrf_token %}
<button type="submit" name="submit" id="submit" value="I Agree" target="_blank">I Agree</button>
<button onclick="window.open('/greeting')" target="_blank"> I Disagree </button></br>
</form>
urls.py:
...
url(r'^' + app_name + 'some_path', views_two, name='name2'),
views.py:
def views_two(request):
if request.method=='POST':
# do something
The difference is that the action points to a different url and thus will be called different views

Flask: Contact Page formatting with bootstrap 3

This is my first time using Flask and I have created the form for the visitors to fill out, but I want to use the bootstrap formatting so its looks similar to another form I am using in the website. Im not sure how I can link the form together. Here is my code for the contact.html page:
{% extends "index.html" %}
{% block content %}
<div class="content fixed-height">
<h3> {{ title }} </h3>
<!--<form action="http://127.0.0.1:5000/static/contact.php" method="post">
<div class="form-group">
<label>Your Name *</label>
<input type="text" name="cf_name" class="form-control" placeholder="Enter Name" required autofocus/>
</div>
<div class="controls-group">
<label class="control-label"> Your e-mail *</label>
<div class="controls">
<input type="email" name="cf_email" class="form-control" placeholder="Enter Email" required/>
</div>
</div>
<div class="form-group">
<label>Message *</label>
<textarea name="cf_message" class="form-control" placeholder="Enter Message" rows="6" required></textarea>
</div>
<input type="submit" value="Send" class="btn btn-primary">
<input type="reset" value="Clear" class="btn btn-primary">
</form> -->
<form action="{{ url_for('contact') }}" method=post
{{ form.hidden_tag() }}
{{ form.name.label }}
{{ form.name }}
{{ form.email.label }}
{{ form.email }}
{{ form.subject.label }}
{{ form.subject }}
{{ form.message.label }}
{{ form.message }}
{{ form.submit }}
</form>
</div>
{% endblock %}
The first part of the contact.html page is an old form that I was using and is in comment tags. Any help would be much appreciated
I'm guessing you're using the WTF Flask extension for working with forms?
Flask also has a Bootstrap extension that you can install using pip:
pip install flask-bootstrap
You can then import it and into the module that your Flask application instance has been created in:
from flask.ext.bootstrap import Bootstrap
app = Flask(__name__)
bootstrap = Bootstrap(app)
This will provide you with some great functionality including a helper method that you can use to quickly generate forms in your HTML templates.
Go to the page where you want to generate the form and after your extends statement do the following:
{% import "bootstrap/wtf.html" as wtf %} # imports the form template elements
# where you want your form to be
{{ wtf.quick_form(form) }} #the method takes the form argument from your view function
This will generate a form for you. You can read more about the Bootstrap extension here. Go to the Templates page and look for the section of Forms. Good luck!

Categories

Resources