How to append string in HTML form - python

I am new to web development . I am using python django framework for creating my website.I wanted to take username as form Input and call a URL like reco/username/ . But when I am trying to append in the username in URL .I am getting only "/reco/" and user name is not appended in the URL.
This is the code snippet .
<form action= "/reco/"+username method="post">
<label for="username">Username: </label>
<input id="username" type="text" name="username" value="{{ current_name }}">
<input type="submit" value="OK">
{{
</form>
I am not sure what I am doing wrong.How can append input field into the url.

Use javascript in the HTML, something like this:
<script>
function myOnSubmit(myForm)
{
myForm.action = "/reco/" + myForm.username.value;
return true
}
</script>
<form onSubmit="return myOnSubmit(this)" action="/reco/" method="post">
<label for="username">Username: </label>
<input id="username" type="text" name="username" value="{{ current_name }}">
<input type="submit" value="OK">
</form>

Related

request.POST parameters are missing

Hello I am trying to pass some values from my signup form to a django view but for some reason the values are missing.
My view.py :
#csrf_exempt
def signup(request):
if request.method =='POST':
for key, value in request.POST.lists():
print(" DEBUG %s %s" % (key, value))
print(request.POST['name'],email=request.POST['email'])
return render(request, 'front_app/login.html')
My register.html :
<form class="form" method="post" action="{% url 'signup' %}" name="submitForm">
{% csrf_token %}
<input type="text" class="name" placeholder="Name" id="name" required>
<input type="email" class="email" placeholder="Email" id="email" required>
<div>
<input type="password" class="password" placeholder="Password (8 characters minimum)" id="password" minlength="8" required>
</div>
<input type="submit" class="submit" value="Register" >
</form>
and my urls.py :
urlpatterns = [
# other not related urls
path('signup', views.signup, name='signup'),
]
My problem is that when the views.signup function is running it is missing all three values that I am trying to send : name, email and password.
It is a POST request (and not GET) but the only values in the QueryDict are the "encoding" and "csrfmiddlewaretoken" values.
Any help is appreciated!
As Selcuk comment,
The request.POST data is a dict filled with the name of the input fields of the HTML form.
Try with :
<form class="form" method="post" action="{% url 'signup' %}" name="submitForm">
{% csrf_token %}
<input type="text" class="name" placeholder="Name" id="name" name="name" required>
<input type="email" class="email" placeholder="Email" id="email" name="email" required>
<div>
<input type="password" class="password" placeholder="Password (8 characters minimum)" id="password" minlength="8" name ="password" required>
</div>
<input type="submit" class="submit" value="Register" >
</form>

Uploaded Image Displaying in Form Data but not File Data in Flask

So I'm trying to upload an image inside a form and then submit it to a python server using Flask.
Right now my issue is that the file name is displaying in the form data, but when I call request.files I get an ImmutableDict, suggesting that the actual image wasn't uploaded, just the name of its file.
HTML FORM:
<form action="/workshops/new" method="post">
<label for=Title">Title</label>
<input type="text" id="Title" name="Title" minlength="10" size="150" value="{{ workshop_info[1] if workshop_info }}" class="form-control" required>
<label for="URL">URL</label>
<input type="text" id="URL" name="URL" minlength=10 tye="url" size="150" value="{{ workshop_info[3] if workshop_info }}" class="form-control" required>
<label for="Description">Description</label>
<textarea id="Description" name="Description" class="form-control" rows="10" required>{{ workshop_info[2] if workshop_info }}</textarea>
<label for="Image">Image</label>
<input type="file" id="Image" name="Image" accept="image/*">
<button class="btn btn-primary btn-large" type="submit">{{ "Update Workshop" if class_info else "Add Workshop" }}</button>
</form>
FLASK CODE:
#app.route('/workshops/new', methods=["POST", "GET"])
def workshopspage():
if request.method == "POST":
print(request.form)
print(request.files)
return redirect('/')
return render_template("workshop.html")
When the request hits, I get the following image in my terminal:
My guess is that there's something that I'm not specifying correctly in my html form, but beyond the name attribute, I'm not sure what else there is.
You need the enctype="multipart/form-data" to the form tag.
<form action="/workshops/new" method="post" enctype="multipart/form-data">

Form customization in Django template

I want to add styling to the below form (main objective is to change the text color of placeholder as my form is of dark color and the placeholder is not visible due to its default gray color) I am sure there must be some way to achieve this in the template only.
Snippet from CSS
::placeholder {
color: aquamarine;
opacity: 1;
}
Snippet from Template
<form action="{% url 'register' %}" class="box" method="POST">
<input type="text" name="username" placeholder="{{form.username.label}}" id=""/>
<input type="text" name="firstname" placeholder="{{form.first_name.label}}" id="" />
<input type="text" name="lastname" placeholder="{{form.last_name.label}}" id=""/>
<input type="text" name="email"placeholder="{{form.email.label}}"id="" />
<input type="text" name="password1" placeholder="{{form.password1.label}}" id=""/>
<input type="text" name="password2" placeholder="{{form.password2.label}}" id=""/>
<input type="submit" value="Submit" />
</form>
This is my form that I have created to add a new user (django.contrib.auth.models User). I am not sure how do I use {{form.username}} in the existing form. If I simply put {{form.username}} to the form it is creating a new field without any styling applied to it.
Maybe I misunderstood what you want to achieve, but you can simply set custom CSS via <style></style> tag. If you would like to a more sophisticated solution, you can define CSS class in form widget attributes or append custom styles to form.
<style>
::placeholder {
color: aquamarine;
opacity: 1;
}
</style>
<form action="{% url 'register' %}" class="box" method="POST">
<input type="text" name="username" placeholder="{{form.username.label}}" id=""/>
<input type="text" name="firstname" placeholder="{{form.first_name.label}}" id="" />
<input type="text" name="lastname" placeholder="{{form.last_name.label}}" id=""/>
<input type="text" name="email"placeholder="{{form.email.label}}"id="" />
<input type="text" name="password1" placeholder="{{form.password1.label}}" id=""/>
<input type="text" name="password2" placeholder="{{form.password2.label}}" id=""/>
<input type="submit" value="Submit" />
</form>
I found a dirty fix for the problem. I first entered made the form like below -
<form action="{% url 'register' %}" class="box" method="POST">
{{form.username}}
{{form.first_name}}
...
</form>
Then I inspected the rendered template and stole the HTML equivalent of the above code. I have added the all the required attributes in the input tags. It looks like below snippet -
{% csrf_token%}
<input
type="text"
name="username"
maxlength="150"
**placeholder="Username"**
autofocus=""
required=""
id="id_username"
/>
<input
type="text"
name="first_name"
maxlength="30"
**placeholder="First Name"**
id="id_first_name"
/>
...
I know this probably is not a perfect solution and there must be a more elegant way of handling this scenario. However, I am going ahead with this approach for time being as it is serving the purpose.

Get Form values in Python using Django framework

My question here is without using Model or forms.Form can we get form values on submit using Django request object.
Here is small example to explain problem.
HTML Code :
<form action="/login/" method="post">
{% csrf_token %}
<input type="text" id="USERNAME" class="text" value="USERNAME" >
<input type="password" id="Password" value="Password" >
<div class="submit">
<input type="submit" onclick="myFunction()" value="LOGIN">
</div>
<p>Forgot Password ?</p>
</form>
views.py Code :
def dologin(request):
print('i am in do login')
print(request.method)
print(request.POST)
for key, value in request.POST.iteritems():
print(key , value)
return render(request,'webapp/login.html')
So here my key values are empty always. I have learned and capable enough to create html forms using Model and forms:Form. But to add more style changes I need to map this forms:Form object to html defined form.
Thanks in advance.
Assign a name to each input
<form action="/login/" method="post">
{% csrf_token %}
<input type="text" id="USERNAME" class="text" name="USERNAME" value="USERNAME" >
<input type="password" id="Password" value="Password" name="Password" >
<div class="submit">
<input type="submit" onclick="myFunction()" value="LOGIN">
</div>
<p>Forgot Password ?</p>
</form>
HTML form elements always need a name attribute, otherwise the browser won't have any way of sending them to the backend. It's that attribute that is the key in the POST dict.
Note that any formatting you can do with HTML on its own you can also do with Django forms; you really should use them in most circumstances.
Please add the HTML attribute using name for every form component.

How to post data via form HTML?

I want to post the data to the server via form. How can I do this?
<div class="panel-body">
<form role="form" action="{% url 'login' %}" method="POST">
{% csrf_token %}
<div class="form-group">
<label for="sender-email" class="control-label">Username:</label>
<div class="input-icon"> <i class="icon-user fa"></i>
<input id="sender-email" type="text" placeholder="Username" class="form-control email">
</div>
</div>
<div class="form-group">
<label for="user-pass" class="control-label">Password:</label>
<div class="input-icon"> <i class="icon-lock fa"></i>
<input type="password" class="form-control" placeholder="Password" id="user-pass">
</div>
</div>
<div class="form-group">
<input class="btn btn-primary btn-block" id="authenticate_user" type="submit" value="Submit">
</div>
</form>
</div>
My views.py
#csrf_exempt
def signin(request):
if request.method == 'POST':
print request.POST.get('sender-email') #prints None
username = request.POST['username'] # throws error, username not available.
password = request.POST['password']
How do I post the data without using jquery? I know of a way of posting through AJAX jquery, but dont wanna do that.
The 'name' attribute of input tags is set as keys of request.GET and request.POST.
Add name attribute to all your input tags.
<input name="username" id="sender-email" type="text" placeholder="Username" class="form-control email">
<input name="password" type="password" class="form-control" placeholder="Password" id="user-pass" >
POST data are populated using the name attribute of your input elements. Change your id attributes or add a name one accordingly. E.g:
<input type="password" class="form-control" placeholder="Password" name="user-pass">
You should also consider using a form to handle your data more easily.

Categories