I am dynamically generating a html page from data in the database(mainly labels retrieved since I'm in the stage of CREATING data to store in the db). I retrieve labels and id's from the database, then store it in a class which I return to jinja2 so that I can then dynamically generate all the labels and input boxes. Here is a snippet:
<div class="dataDiv">
<label class="inputBoxLabels">Device<span style="padding-left: 85px;font-size: 12px;">New</label>
<select id="devices" class="inputBoxes" style="height: 25px;">
{% for key, value in devices.iteritems() %}
{% if deviceID == key %}
<option value="{{ key }}" selected="selected">{{ value }}</option>
{% else %}
<option value="{{ key }}">{{ value }}</option>
{% endif %}
{% endfor %}
</select>
</div>
another example, this time an input box:
{% if inspection.statusDict|length > 0 %}
<select class="inputBoxes" id="ins_' + {{ inspection.insID }} + '" style="height: 25px;">
{% for key, value in inspection.statusDict.iteritems() %}
<option value="{{key}}">{{value}}</option>
{% endfor %}
</select>
{% else %}
<input type="text" class="inputBoxes" id="ins_' + {{ inspection.insID }} + '">
{% endif %}
This is what the select list looks like after is has been populated for visual reference:
Now the problem. I have everything inside a form and I have no idea how to retrieve the data from each input and select when I receive the post since it's all dynamically generated.
I originally thought of using jquery instead and ajax but if possible I'd like to stick to forms
Off the top of my head I think if you're submitting to a Pyramid view via POST you should be able to iterate over request.POST to get whatever was submitted.
Something like and inspect each item
for item in request.POST.keys():
print item + ' - ' + request.POST[item]
I'd have to try it when I get home to a console to confirm.
Related
I have a form that I am using for post the data
<form enctype="multipart/form-data" method="post" action="">
<div class="form-group">
<label>Application Name <span class="mandatory">*</span></label>
<input type="text" class="form-control" name="app_name" id="appname" required maxlength="40">
<button>submit</button>
</div>
</form>
In flask i am fetching the form data and trying to do post method
if request.method == "POST":
application_data = request.form.to_dict()
postedata = post(application_data )
if posteddata:
print("sucessfully posted")
else:
print("unsucessful")
return render_template("application/addapplication.html", data=application_data)
but what I want is when else part executes that means post data doesnot happens i want to retain the values in the form. but, since here page will reload the form data is disapperaring. please can anyone help me in this?
<input type="text" value="{{ request.form.get('app_name','')}}" class="form-control" name="app_name" id="appname" required maxlength="40">
For Select tag, Let's take the data from the Flask flask_option = 'batman'.
<select>
<option {% if flask_option == "superman"%} selected {% endif %} value="superman">Clark</option>
<option {% if flask_option == "batman"%} selected {% endif %} value="batman">Bruce</option>
<option {% if flask_option == "wonderwomen"%} selected {% endif %} value="wonderwomen">Diana</option>
<option {% if flask_option == "aquaman"%} selected {% endif %} value="aquaman">Arthur</option>
</select>
If you are using API for the select options,
let's take the API response like this,
{'response': [
{'value': 'superman', 'inner_text': 'Clark'},
{'value': 'batman', 'inner_text': 'Bruce'},
{'value': 'aquaman', 'inner_text': 'Arthur'},
{'value': 'wonderwomen', 'inner_text': 'Diana'}
]}
You can iterate over the API to generate the select tag,
<select>
{% for value, text in varible_name.response %}
<option {% if flask_option == value %} selected {% endif %} value = '{{value}}'> {{text}} </option>
{% endfor %}
</select>
For textarea, you can use
<textarea>{{reqest.form.get("txt")}}</textarea>
or javascript
$('textarea').text('{{reqest.form.get("txt")}}')
I have Select Option Tag such as
<select class="form-control" name="some_name" id="some_name">
{% for newdata in data %}
<option value="{{newdata.id}}" {% if "newdata.id==demodata.id" %} selected {% endif %}>{{newdata.name}}</option>
{% endfor %}
</select>
i am Displying option value dynamically using "data" variable. "demodata" is another variable containing values.
Now i want to make selected option selected when "newdata.id==demodata.id" this condition is true.However below code is not working
<option value="{{newdata.id}}" {% if "newdata.id==demodata.id" %} selected {% endif %}>{{newdata.name}}</option>
i don't Know how to do that?
Remove quotes and it should work
{% if newdata.id == demodata.id %}
I am trying to get the selected value in the dropdown to add to the cart. The way I have it prints out different dropdowns but submits the data into the cart. I just want one dropdown that submits the selected value. Thank you.
{% for product in products %}
<form class = 'pull-right' method ='GET' action='{% url "update_cart" product.slug 1 %}'>
<select id="menulist">
<option>{{ product.name }}: ${{ product.price }}</option>
{% endfor %}
</select>
<button type = 'submit' class ="btn btn-info btn-md" class ='pull-right'>Add To Order</button>
</form>
Simply two things need.
First, You should setup option's value. second, forloop should target only option, not whole form.
<form class = 'pull-right' method ='GET' action='{% url "update_cart" product.slug 1 %}'>
<select id="menulist" name="{# your select's name here #}">
{% for product in products %}
<option value="{{ product.id|slugify }}">{{ product.name }}: ${{ product.price }}</option>
{% endfor %}
</select>
<button type = 'submit' class ="btn btn-info btn-md" class ='pull-right'>Add To Order</button>
</form>
This code snippet show two different point. 1. option have value, select has name. 2. forloop should in select tags.
In my python file I have a dictionary
results = {'Key1':'Value1', 'Key2':'Value2'}. I passed it in return render_template('pages/queries.html', results=results)
Now in html I have
<select name="results">
{% for key, value in results.items() %}
<option value="{{ key }}">{{ key }}</option>
{% endfor %}
</select>
{% for value in results.values() %}
<textarea rows="10" cols="40" name="results"> {{value}} </textarea>
{% endfor %}
This is unfortunately displaying three textareas for some reason. The desired result I want is someone selects a value from the dropdown (select html) and if they choose 'key2' then I want 'value2' to appear inside of textarea. If they choose 'key1' then dynamically I want textarea to update to 'value1'. But this isn't happening and I've tried changing the locations of all the jinja codes and variations and haven't figured it out, please help.
You need to add onChange event handler and update text area accordingly.
<select name="results" onchange="changeText(this);">
{% for key, value in results.items() %}
<option value="{{ value }}">{{ key }}</option>
{% endfor %}
</select>
<textarea rows="10" cols="40" name="results" id="myTextArea"> {{results.values()[0]}} </textarea>
JS code for updating text area on onChange event.
function changeText(el) {
document.getElementById('myTextArea').value = el.value;
}
I'm able to iterate the choices in django forms choice field. But I need to mark select in the multiple select widget.
Please view the below code
<select name="project-team" id="search" class="form-control" size="12" multiple="multiple">
{% for value, text in form.project_team.field.choices %}
<option value="{{ value }}">{{ text }}</option>
{% endfor %}
</select>
I found the solution for my question
{{ form.fields.project_team.initial }} (or)
{{ form.project_team.field.initial }}
Both ways works for me. form.project_team.field.initial returns the initial values as list which we could iterate.