I have changed the button from checkbox to radio
I am using checkbox in this way:
<input type="radio"name="group1"value="0">
<input type="radio"name="group1"value="1">
<input type="radio"name="group1"value="2">
<input type="radio"name="group1"value="3">
in my view.py
boxes = request.POST.getlist("group1")
Which the boxes is an empty array. I have also tried:
boxes = requset.POST.getlist("group1", [])
boxes = request.POST.getlist("group1[]")
boxes = request.POST("group1") <-- I have seen from other post said
this would only return the value
the value of last element but I am also okay as the
box will only have one box clicked
however, all of the above cannot successfully get the checkbox value.
Now I have found the problem since i am doing this way:
<form id="submit_form" method="POST">{% csrf_token %}</form>
<div form="submit_form">
<input type="radio"name="group1"value="0">
<input type="radio"name="group1"value="1">
<input type="radio"name="group1"value="2">
<input type="radio"name="group1"value="3">
</div>
So it doesn't work.
I need to change it to
<input form="submit_form" type="radio"name="group1"value="0">
<input form="submit_form" type="radio"name="group1"value="1">
<input form="submit_form" type="radio"name="group1"value="2">
<input form="submit_form" type="radio"name="group1"value="3">
But is there a better way to do it?
Related
I have the below List in Python.
list_val = ['APPROVED','UN-APPROVED','DEACTIVATE']
and need to pass this list values into a Check box with Jinja Template.
Can someone help on this with HTML code embedded with Jinja template ?
Expected Output:-
HTML Need to converted with JINJA Template.
<input type="checkbox" id="val1" name="val1" value="app">
<label for="val1"> APPROVED</label><br>
<input type="checkbox" id="val2" name="val2" value="unapp">
<label for="val2"> UN-APPROVED</label><br>
<input type="checkbox" id="val3" name="val3" value="deac">
<label for="val3"> DEACTIVATE</label>
Try this code
This code will have input tags with values like approved, un-approved, deacitvate instead of app, unapp, deac. Is that okay for you?
And also its better to put the input tag inside the label tag, because when you click the word beside the checkbox, it'll toggle the checkbox (and thats why labels are mostly used for)
As W3schools says:
Proper use of labels with the elements above will benefit:
Screen reader users (will read out loud the label, when the user is focused on the element)
Users who have difficulty clicking on very small regions (such as checkboxes) - because when a user clicks the text within the <label> element, it toggles the input (this increases the hit area).
Tip: The for attribute of <label> must be equal to the id attribute of the related element to bind them together. A label can also be bound to an element by placing the element inside the <label> element.
{% for i in range(list_val_len) %}
<label for="val{{ i+1 }}" name="val{{ i+1 }}">
<input type="checkbox" id="val{{ i+1 }}" name="val{{ i+1 }}" value="{{ list_val[i].lower() }}">
{{ list_val[i] }}
</label><br>
{% endfor %}
And also pass the list_val list and its length in seperate keyword arguments on the render_template function like
list_val = ['APPROVED','UN-APPROVED','DEACTIVATE']
#app.route('whatever_route_in_here')
def whatever_name_your_function_has():
...
...
render_template('html_file_name.html', list_val=list_val, list_val_len=len(list_val))
Tell me if its not working...
There is a text box (ID) on the website and I want to put 10,000 data in it. After placing each data in this text box, results are displayed in other text boxes according to the ID.
Textbox ID :
<input class="form-control ltr left text-box single-line" data-val="true" data-val-regex="It is 10 numbers" data-val-regex-pattern="^[0-9]{10}$" data-val-required="*required" id="NId" maxlength="10" name="NId" onblur="LoadInfo()" type="text" value="">
Textobx Name (fill after enter the ID in text box) :
<form action="/Employees/Manager/SavePerson" data-ajax="true" data-ajax-begin="onpostcreatebegin" data-ajax-complete="onpostcreatecomplete" data-ajax-loading="#ajaxloading" data-ajax-method="post" data-ajax-mode="replace" data-ajax-update="#result" id="form0" method="post" novalidate="novalidate"><input name="__RequestVerificationToken" type="hidden" value="asdxBadsP7CpS53654as6dadH3865asdadKhjasdad"> <input type="hidden" name="empId" id="empid" value="0">
<div class="panel panel-info">
<div class="panel-body">
<input data-val="true" data-val-regex="It is 10 numbers" data-val-regex-pattern="^[0-9]{10}$" data-val-required="*required" id="NId" name="NId" type="hidden" value="1234567890">
<input data-val="true" data-val-number="The field PersonId must be a number." data-val-required="The PersonId field is required." id="PersonId" name="PersonId" type="hidden" value="254102232">
<input data-val="true" data-val-required="The GuidId field is required." id="GuidId" name="GuidId" type="hidden" value="665xs6asd-cxc2-wq56-8888-30654998b166">
<div class="form-group">
<div class="col-md-4">
<input class="form-control text-box single-line" data-val="true" data-val-regex="enter the name." data-val-regex-pattern="^[\u0600-\u06ff\s]+$|[\u0750-\u077f\s]+$|[\ufb50-\ufc3f\s]+$|[\ufe70-\ufefc\s]+$|[\u06cc\s]+$|[\u067e\s]+$|[\u06af\s]$|[\u0691\s]+$|^$" data-val-required="*required" id="Firstname" name="Firstname" type="text" value="jack">
<span class="field-validation-valid text-danger" data-valmsg-for="Firstname" data-valmsg-replace="true"></span>
</div>
</div>
</div>
</div>
</form>
The page will not reload after entering the value in the text box ID. Shows the value on that page. What solution do you suggest? I do not know which method to consider that is the most optimal method. Can you introduce the most optimal and practical method?
Depending on how complex the task is, you can use either Selenium (Selenium is a script-controlled Browser) with Firefox WebDriver, for example.
It is of course also possible to use the request methods GET and POST as a method with more work but much higher performance.
The below code is in views.py .I want to take a variable from the user instead of the '360p' after user pastes the video link. Is there a way to show how to get the resolution from the user.I have to take input from the user.
The full code looks something like the below webpage
https://www.hexascholars.com/code-snippet/youtube-video-download-using-django-and-python/
def get_download(request):
if request.method == 'GET':
if(request.GET.get('url')):
url = request.GET['url']
try:
yt = YouTube(url)
title = yt.title
stream = yt.streams.filter(res='360p').first()
path = download_path()
stream.download(path)
message = "Download Complete!"
video = Video()```
If you want to do it the "plain vanilla" way, i.e. without using django Forms you can just add a grup of radio buttons or a select to the form in your html, e.g.
<form method="GET" action="/your/url/">
<div class="form-group">
<label>Enter Youtube URL</label>
<input type="url" class="form-control" required="required" name="link">
</div>
<div class="form-group">
<label>Resolution</label>
<fieldset>
<input type="radio" name="res" id="res1" value="360p">
<label for="res1">360p</label>
<input type="radio" name="res" id="res2" value="720p">
<label for="res1">720p</label>
</fieldset>
</div>
<button type="submit" class="save btn btn-success">Download</button>
</form>
In your view you can fetch the parameter the same way you are getting the url:
res = request.GET.get('res')
and then use "res" instead of your hard-coded string.
I'm working on a simple UI to start and stop games by ID. The basic HTML I have written is as follows (game_id is populated by JS):
<div align="center" class="top">
<div align="left" class="game-id-input">
Game ID: <input type="text" name="game_id" id="game_id">
</div>
<div align="right" class="buttons">
<form action="{{ url_for('start_game', game_id=game_id) }}" method="get">
<input type="submit" name="start" value="Start game" class="btn btn-success"></input>
</form>
<form action="{{ url_for('end_game', game_id=game_id) }}" method="get">
<input type="submit" name="end" value="End game" class="btn btn-danger"></input>
</form>
</div>
</div>
which looks like
I also have Flask route functions defined for each of the forms:
#app.route("/start_game/<game_id>")
def start_game(game_id):
# ...
#app.route("/end_game/<game_id>")
def end_game(game_id):
# ...
In my forms, how can I make game_id correspond to the game_id from #game_id?
Currently when I submit start and end games, I get a File Not Found error because it's just appending the literal <game_id> to the route.
I'm new to web development. This should be trivial, but I don't know what to search for. Sorry in advance for such a simple question.
You are trying to generate a url based on user input, but user input isn't available when Jinja is rendering the template on the server side, it's only available on the client side. So if you wanted to post to URLs with the game id as a URL parameter, you would have to build that URL on the client side with JavaScript.
For what you're trying to do, that's not really necessary. You can get the submitted value of a named input with request.form['name']. Buttons are just like any other input, so you can name them to find out what action was taken.
#app.route('/manage_game', methods=['POST'])
def manage_game():
start = request.form['action'] == 'Start'
game_id = request.form['game_id']
if start:
start_game(game_id)
else:
stop_game(game_id)
return redirect(url_for('index'))
<form method="POST" action="{{ url_for('manage_game') }}">
<input type="text" name="game_id"/>
<input type="submit" name="action" value="Start"/>
<input type="submit" name="action" value="Stop"/>
</form>
Even that's more verbose than you need. Given that you'd know if a game was already in progress, just toggle the current status instead of picking an action. It would never make sense to start a game that's already started, only stop it.
I cannot comment, but I would like to correct davidism's code.
I believe that you need action within your form element with a value which corresponds to the function within the server python code for this to work. Minor, but an important correction. So it would be like this:
In your server.py:
#app.route('/manage_game', methods=['POST'])
def manage_game():
start = request.form['action'] == 'Start'
game_id = request.form['game_id']
if start:
start_game(game_id)
else:
stop_game(game_id)
return redirect(url_for('index'))
In your HTML:
<form method="POST" action=/manage_game>
<input type="text" name="game_id"/>
<input type="submit" name="action" value="Start"/>
<input type="submit" name="action" value="Stop"/>
</form>
My code looks like this:
<form name="deleteUser" action="/groupmanager" method="post"><div id="x"> {% csrf_token %}
<input type="hidden" name="username" value = "{{name}}"></input>
<input type="hidden" name="groupName" value = "{{group}}"></input>
<input type="submit" name="xButton" id="xButton" value="x"></div></form>
And the code works exactly the way I want it to but now that I've added it, the layout of the page has changed. Now the button has moved onto a new line instead of being on the same line as the things before it in the code.
My code used to look like this:
<div id="x"><input type="submit" name="xButton" id="xButton" value="x"></div>
I beleave the change is in IE only ? Try adding position:relative; float:left to the css of hidden inputs.