How to grab a file from django select DocumentForm? - ajax

I have a select form in django templates:
<form action="{% url "graph" document.docfile.name %}" method="post" enctype="multipart/form-data">
{% csrf_token %}
<select name="{{ document.docfile.name }}" id="{{ document.docfile.name }}" onchange="this.form.submit()">
<option value=""></option>
{% for document in documents %}
<option value="{{ document.docfile.name }}">{{ document.docfile.name }}</option>
{% endfor %}
</select>
</form>
I want to pick the selected file in views.py. I tried request.POST.get() with no success:
if request.method == 'POST':
doc = request.POST.get("name", "")
How can I grab the name of the selected file in python views.py?

Related

Add add to cart and button variant selector in collection page - Shopify

I have edited my store to have an add to cart button and variant selector in the collection page and it's working. But my boss want another change, how can I change the dropdown list to button selector?
My code form
{% unless sold_out %}
<form action="/cart/add" method="post" enctype="multipart/form-data" id="product-form-{{ product.id }}" class="product-form">
<div class="add-to-cart__wrapper" style="margin-top:0px; margin-bottom: 10px;">
<button type="submit" name="add" class="btn btn--splash btn--full uppercase addToCart">
<span id="AddToCartText">Add to Order</span>
</button>
</div>
{% if product.variants.size == 1 %}
<input type="hidden" id="variant-select" name="id" value="{{ product.variants.first.id }}" />
{% else %}
<div class="selector-wrapper">
<select name="id" id="productSelect" class="product-single__variants btn--full uppercase">
{% for variant in product.variants %}
{% if variant.available %}
<option {% if variant == product.selected_or_first_available_variant %} selected="selected" {% endif %} value="{{ variant.id }}" data-sku="{{ variant.sku }}">{{ variant.title }}</option>
{% else %}
<option disabled="disabled">
{{ variant.title }} - {{ 'products.product.sold_out' | t }}
</option>
{% endif %}
{% endfor %}
</select>
</div>
{% endif %}
</form>
{% endunless %}
Please advise.
Thank you!
You could change the select element to a radio button element and style the radios as regular buttons. This pattern is fairly common, you just need to make sure your event listener target for the variant selection is the same as you have now.

How to save current appended fillter to collecttions page to display it current state? shopify

How to save current appended fillter to collecttions page to display it current state
like what i selected
so i have 4 filters
date sort, brand, category and a price range
so all of these filters is displayed in adress bar
and i need to save information about selected option so i can display what is currently selected on page
how to do it?
here is example of 2 filters:
<select
name="brands"
id="brands"
onchange="FILTER.searchParams(event, 'filter.p.vendor')"
>
<option value="{{ collection.url }}">ALL</option>
{% for product_vendor in collection.all_vendors %}
<option {% if option.vendor == product_vendor %} selected="selected" {% endif %} >{{ product_vendor }}</option>
{% endfor %}
</select>
<select
name="category"
id="category"
onchange="FILTER.changePath(event)"
>
<option value="{{ collection.url }}">ALL</option>
{% for collection in collections %}
<option value="{{ collection.url }}">
{{ collection.title }}
</option>
{% endfor %}
</select>

how to refresh template after ajax call

I have a form that contains two select inputs one is for categories and the other for sub categories the form should work like this user should choose an option in the categories and based on that option the sub category options should be updated with new values. but for some reason the sub category options aren't updating
template dashboard.html
{% block body %}
<form>
{% csrf_token %}
<div class="row">
<div class="input-field col s6 offset-s3">
<select id="list">
<option value="" disabled selected>Choose your Category</option>
<option value="education">University/College</option>
<option value="hospital">Hospital</option>
<option value="business">Business Organizations</option>
</select>
<label>Categories</label>
</div>
<div class="input-field col s6 offset-s3">
<select>
<option value="" disabled selected>Choose your Category</option>
{% for d in data %}
<option value="">{{ d.username }}</option>
{% endfor %}
</select>
<label>Sub Categories</label>
</div>
</div>
</form>
{% endblock %}
{% block script %}
<script type="text/javascript">
$('#list').change(function() {
$.ajax({
type: 'POST',
url: '/dashboard/',
data: {
category: $('#list').val(),
csrfmiddlewaretoken: '{{ csrf_token }}'
}
});
});
</script>
{% endblock %}
view.py
from django.shortcuts import render, redirect
from django.contrib.auth.models import User
def dashboard(request):
if not request.user.is_authenticated:
return redirect('index')
else:
if request.method == 'POST':
category = request.POST['category']
#Here i am using User table because category table is empty
data = User.objects.all()
print(data)
return render(request, 'usecases/dashboard.html', {'data': data})
else:
return render(request, 'usecases/dashboard.html')
This is your subcategories where I just add an id #sub_categories
<select id='sub_categories'>
<option value="" disabled selected>Choose your Category</option>
{% for d in data %}
<option value="">{{ d.username }}</option>
{% endfor %}
</select>
<label>Sub Categories</label>
JS
$.ajax({
type: 'POST',
url: '/dashboard/',
data: {
category: $('#list').val(),
csrfmiddlewaretoken: '{{ csrf_token }}'
},
success:function(response){
$('#sub_categories').replaceWith($("#sub_categories",response))
}
});

Shopify - Show inline element on varient select

Currently I am trying to show/hide an inline element on the page when a specific variant of the product is selected in a <select> input. I've tried multiple tries with jquery to access the select with no luck and even tried inline <% if %> liquid tag. Any help would be greatly appreciated!
Basically I want a textbox to show when two of the options are selected else not show the textbox.
Below is what I have:
{% if product.variants.size > 1 %}
<div id="product-variants" class="card_options">
<select id="product-select-{{ product.id }}" name="id" class="hidden line-item-property__field">
{% for variant in product.variants %}
<option {% if variant == product.selected_or_first_available_variant %} selected="selected" {% endif %} value="{{ variant.id }}" data-sku="{{ variant.sku }}">{{ variant.title }} - {{ variant.price | money }}</option>
{% endfor %}
</select>
</div>
<input type="hidden" name="id" value="{{ product.selected_or_first_available_variant.id }}" />
{% endif %}
Now if only I could add something like below to add the textbox when option1 or option2 are selected.
<-- Same as above -->
{% if product.variants.size > 1 %}
<div id="product-variants" class="card_options">
<select id="product-select-{{ product.id }}" name="id" class="hidden line-item-property__field">
{% for variant in product.variants %}
<option {% if variant == product.selected_or_first_available_variant %} selected="selected" {% endif %} value="{{ variant.id }}" data-sku="{{ variant.sku }}">{{ variant.title }} - {{ variant.price | money }}</option>
{% endfor %}
</select>
</div>
<input type="hidden" name="id" value="{{ product.selected_or_first_available_variant.id }}" />
{% endif %}
<-- End Same as above -->
<-- New Code -->
{% if variant != option1 %}
<p class="line-item-property__field" id=card_message>
<label for="card-message">Card Message:</label>
<span id="char-counter"></span><span id="message-alert"></span>
<textarea id="message-textarea" maxlength="250" name="properties[Card Message]"></textarea>
</p>
{% else %}
<span id="placeholder"></span>
{% endif %}
This is what it should look like:
UPDATE: Apparently my solution with jQuery worked. I was just targeting the wrong select on the page. I had to retrieve the select dynamically instead of finding it by class or id. For some reason Shopify creates a second <select> input and hides the one you see in products.liquid document. So I had to resort to using $(".selector-wrapper select").bind('change', function(event) {//do something} and var selected = $('.selector-wrapper select option:selected').val(); to retrieve the values of the options. I'll link a fiddle I created with the same logic, you will just have to update it with what I listed above. Hope this helps anyone looking for same solution.
Fiddle Demo

Django1.10 - /i18n/setlang/ CSRF token missing or incorrect

After selecting a language in a language switcher form, I got a CSRF error:
The form is in base.html
<form action="{% url 'set_language' %}" method="post" class="form-inline">
{% csrf_token %}
<input name="next" type="hidden" value="" />
<div class="form-group">
<div class="input-group">
<div class="input-group-addon"><i class="fa fa-globe" aria-hidden="true"></i></div>
<select name="language" class="form-control" id="lang-switcher">
{% get_current_language as LANGUAGE_CODE %}
{% get_available_languages as LANGUAGES %}
{% get_language_info_list for LANGUAGES as languages %}
{% for language in languages %}
<option value="{{ language.code }}"{% if language.code == LANGUAGE_CODE %} selected="selected"{% endif %}>
{{ language.name_local }} ({{ language.code }})
</option>
{% endfor %}
</select>
</div>
</div>
</form>
I submit the form with JS:
jQuery('#lang-switcher').change(
function(){
jQuery(this).closest('form').trigger('submit');
});
my template file art.html is as follow:
{% extends "base.html" %}
{% load staticfiles %}
{% load i18n %}
{% block content %}
....
{% endblock %}
views.py is as follow:
from django.template import RequestContext
from django.shortcuts import render_to_response
from .models import Exhibition, Picture
def index(req):
highlight = Exhibition.objects.latest()
exhibitions = Exhibition.objects.all()[1:]
return render_to_response('art.html', RequestContext(req,{'highlight': highlight, 'exhibitions': exhibitions}))
urls.py is as follow:
urlpatterns = [
url(r'^i18n/', include('django.conf.urls.i18n')),
url(r'^admin/', admin.site.urls),
url(r'^art/', index),
url(r'^$', views.flatpage, {'url': '/home/'}, name='home')
]
I can load the page w/o problems, then when I submit the form to switch language I get the CSRF error.
edit
I must add that the form works well when I'm on root.
I finally solved it by using a different render function in my view:
return render(req, 'art.html', {'highlight': highlight, 'exhibitions': exhibitions})

Resources