Django - pass js variable to django view

Question

My question is related to the Google Maps JavaScript API. More specific the autocomplete function.

I've added the autocomplete function as a search bar to my test site and this works fine, but now I want to pass the chosen paramater to a Django view. And here I'm stuck.

This is what I have in my template:

<script src="https://maps.googleapis.com/maps/api/js?sensor=false&libraries=places"></script>
<script type="text/javascript">
   function initialize() {
      var input = document.getElementById('searchTextField');
      var autocomplete = new google.maps.places.Autocomplete(input);
   }
   google.maps.event.addDomListener(window, 'load', initialize);
   google.maps.event.addListener(autocomplete, 'place_changed', function() {
   var place = autocomplete.getPlace();
   });
</script>

<form method="post" action="">{% csrf_token %}
    <input id="searchTextField" type="text" placeholder="Enter a location" autocomplete="on">
    <input type="submit" value="Search" class="postfix button"/>
</form>

And this in my view:

def homepage(request):
    if request.method == 'POST':
        location = request.POST
else:
    location = ''
return render_to_response('homepage.html', {'location':location}, context_instance = RequestContext(request))

What I want to do is to pass the variable 'place' to the variable 'location' in my Django view (the var place should contain the lat and lon, and this I want to use then further in Geodjango). The request.POST gives the following: <QueryDict: {u'csrfmiddlewaretoken': [u'4xp3nNwzeITb1zHhkBkSGlZSPtGwmuMB']}> But this I can't use.

Is it possible to pass the content of var place to the django view?

Thanks for the feedback!

EDIT: my workaround for the moment using geopy:

Template:

<input id="searchTextField" name="searchTextField" type="text" placeholder="Enter a location" autocomplete="on">

View:

if request.method == 'POST':
    location = request.POST.get('searchTextField')
    gn = geocoders.Google()  
    place, (lat, lng) = gn.geocode(location)

Still looking for a way to access the var place in the script. Is this possible?

Create a hidden field, and set its value to place using javascript; and trigger populating of this using jquery on form's submit button. — Burhan Khalid
– Burhan Khalid, Commented Aug 10, 2012 at 7:33
What @BurhanKhalid said. You need to use javascript to get the place value into the form, then when you submit the form it will be sent to your Django view and you can access it the same way... request.POST.get('place'). — katy lavallee
– katy lavallee, Commented Aug 10, 2012 at 22:31
Thx for the reply. Add the end of the script I added the following: document.getElementById('place').value = autocomplete.getPlace(); and in the form I inserted an extra input field: <input id="place" name="place" type="text" />. But the value of field place remains empty. Is this because the var place is not calculated before the form is submitted? — Köver
– Köver, Commented Aug 11, 2012 at 7:40

katy lavallee · Accepted Answer · 2012-08-09 21:51:05Z

3

First add a name attribute to your search input. Let's say you called it searchTextField like the id. Then you can do request.POST.get('searchTextField').

answered Aug 9, 2012 at 21:51

katy lavallee

2,7711 gold badge28 silver badges26 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

Köver Over a year ago

Thx for the reply. Indeed yesterday evening I build a workaround based on the name of the field. see my update. But still looking for a way to access the var place in the script.

girijesh96 Over a year ago

@Katy lavallee. I have a question in a similar context. I have a function in view.py say 'def home(request)'. Now I want to access the variable/value at "static/DjangoApp/DjangoApp.js". I know to access the values at html page by rendering the page like this: return render(request, 'search_bar/home.html', {'table': table_name}). but how we can access value at .js page. any hint would be really appreciable.

katy lavallee Over a year ago

@girijesh96 Generally you would submit the form via Javascript. I don't know enough about Google's autocomplete input to know if you can post it as a normal HTML form.

katy lavallee Over a year ago

@girijesh96 also, did you see the first comment on the original question? you can create a hidden field and use javascript to set the value of that field to the value in your autocomplete box.

Collectives™ on Stack Overflow

Django - pass js variable to django view

1 Answer 1

4 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related