Обмен данными из html или javascript с python Django
Я прочитал все сообщения и не могу найти ничего, что подойдет для моей программы. Я использую js-фреймворк mapbox и хочу отправить «позицию» местоположения пользователей в мой код представления Python, чтобы сохранить его в базе данных. Когда я использую console.info () в коде js, он ничего не печатает. Когда я печатаю на питоне, он печатает «Нет». Я пробовал ajax, как и другие сообщения, но, похоже, ничего не работает. Возможно, я неправильно передаю данные из шаблонов в код Python ... Помогите, пожалуйста
base.html
<!DOCTYPE html>
<html lang = "en" dir = "ltr">
<head>
<script src = "https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"> </script>
</head>
</html>
home.html
{% extends "geotracker/base.html" %}
{% load static %}
{% block content %}
<body>
<div id='map' width='100%' style='height:400px'></div>
<form id = "myform" name = "myform">
{% csrf_token %}
<input type = "hidden" id = "location" name = "location"/>
</form>
<script>
mapboxgl.accessToken = 'mytoken';
var map = new mapboxgl.Map({
container: 'map', // container id
style: 'mapbox://styles/mapbox/streets-v9',
center: [-96, 37.8], // starting position
zoom: 3 // starting zoom
});
// Add geolocate control to the map.
var geolocate = new mapboxgl.GeolocateControl();
map.addControl(geolocate);
geolocate.on('geolocate', function(e) {
console.info('locating...');
var lon = e.coords.longitude;
var lat = e.coords.latitude
var position = [lon, lat];
var element = document.getElementById('location');
element.innerHTML = position;
$('#myform').submit(function (ev) {
//ev.preventDefault();
console.info('hello');
});
});
</script>
</body>
{% endblock %}
views.py
def home(request):
context = {
"mclient": mclient
}
print("POST in view:\t%s" % request.POST.get('location'))
# get users location if authenticated
if request.user.is_authenticated:
Fan.objects(user=str(request.user)).modify(set__currentPosition=
[0,0], image='http://localhost:8000/media/%s' %
request.user.profile.image, upsert=True)
return render(request, 'geotracker/home.html', context)
console.info - это то же самое, что и печать в js. frm - это форма. request.POST - пустой словарь запросов. Проблема в том, что ajax и отправка формы никогда не запускаются, потому что console.info ('submitting ...') никогда не выполняется.
хорошо, я не читал внимательно. насколько я знаю, для .submit нужен input с типом submit, что означает, что нужна кнопка, иначе он просто останется там, пытаясь прослушать отправку. Поскольку вы делаете это внутри geolocate.on, я бы вынул $('#myform').submit(fu и запустил ajax прямо внутри geolocate.on, сравните эти два, один с кнопкой, а другой нет, но откройте браузер и проверьте. jsfiddle.net/mfv5eLow (с btn) jsfiddle.net/mfv5eLow/1 (без btn) надеюсь, я не ошибаюсь
ваше редактирование оставило .submit (из моего примера) внутри прямого вызова ajax. >. <"то, что я имел в виду, .submit() не должно быть, срыз для моего плохого английского
Я отредактировал свой код с изменениями. Даже когда я закомментирую preventDefault (), он все равно не распечатает «привет». Однако, если я сделаю версию с помощью кнопки, она будет работать, но это может быть связано с тем, что тип ввода ввода обрабатывает событие, а не jquery. Возможно ли, что у меня неправильно установлен jQuery?
может мне не стоит использовать .submit. То, что я имел в виду под .submit, прежде чем иметь в виду $('#myform').submit(function (ev), ваш ajax не должен вызываться внутри этой функции. Тот, у которого есть кнопка, работает, потому что если вы напишете код внутри этой функции, это означает, что он ждет события отправки, которое происходит только тогда, когда вы нажимаете кнопку. Но поскольку вы делаете это без кнопки в своем html, переместите ajax или в этот момент, когда тестируете console.info из $('#myform').submit(function (ev), эта рабочий пример не будет работать, но это то, что я имею в виду jsfiddle.net/49ykg3sn
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 1
Я не мог понять оператор jquery ajax, но понял, что могу просто использовать простой AXAJ для отправки запроса Post с помощью XMLHttpRequest. Используя этот метод, я смог отправить форму с почтовым запросом, не обновляя страницу, чтобы получить местоположение пользователей из Mapbox Api. Мне просто нужно отправить свой токен авторизации из панели администратора Django, который я могу получить из переменной python, отправленной в мой шаблон.
geolocate.on('geolocate', function(e) {
console.info('locating...');
var lon = e.coords.longitude;
var lat = e.coords.latitude
var position = lon + " " + lat;
var element = document.getElementById('location');
element.value = position;
var url = 'http://localhost:8000'
var params = JSON.stringify({
longitude: lon,
latitude: lat
});
// Create a new AJAX request object
var request = new XMLHttpRequest();
// Open a connection to the server
request.open('POST', url, true);
// Actually send the request
var csrftoken = '{{ csrf_token }}'
request.setRequestHeader("Content-type", "application/json");
request.setRequestHeader('X-CSRFToken', csrftoken);
request.send(params);
});
что у тебя
console.info()? Вы пытались увидеть, что находится вfrmиfrm.serilize(), а также в pythonprint, только вrequest.POST? PS в вашемajaxя считаю должно быть полеurl?