Функция JQuery Ajax success не может получить доступ к Django View jsonresponse из представления
Мой взгляд
class MusicianLikesView(DetailView):
model = Musician
template_name = "guitar_blog/blog_detail.html"
def post(self, request, **kwargs):
song = self.get_object()
user_id = request.user.id
user_username = request.user.username
if request.user.is_authenticated:
if "Like1" in request.POST and user_username not in song.music_1_users.keys():
song.music_1_votes += 1
song.music_1_users[user_username] = user_id
song.save()
return JsonResponse({"likes": song.music_1_votes})
elif "Unlike1" in request.POST and user_username in song.music_1_users.keys():
song.music_1_votes -= 1
song.music_1_users.pop(user_username)
song.save()
return JsonResponse({"likes": song.music_1_votes})
Мои урлы
path('ajax/', MusicianLikesView.as_view(), name="song_likes"),
Мой шаблон
<form method="post" class="voting-setup top_song">
{% csrf_token %} {% if user.get_username in musician.music_1_users %}
<button name="Unlike1" type="submit" class="like-button">
<i class="fa-solid fa-guitar icon"
><span class="like-text">Unlike</span></i
>
</button>
{% else %}
<button name="Like1" type="submit" class="like-button">
<i class="fa-solid fa-guitar icon"
><span class="like-text">Like</span></i
>
</button>
{% endif %}
</form>
<span class="after-like first_song_likes">Liked {{ musician.music_1_votes }}</span>
Мой файл Javascript
$(document).on("submit", ".top_song", function (event) {
event.preventDefault();
$.ajax({
type: "POST",
url: "ajax/",
data: {
csrfmiddlewaretoken: "{{ csrf_token }}",
},
success: function (response) {
console.log(response);
},
error: function (re) {
console.log(re);
}
});
});
Моя ошибка в консоли
POST http://127.0.0.1:8000/guitar_blog/20/ajax/ 404 (Not Found)
Мои изменения во взглядах
def musician_likes_view(request, pk):
song = Musician.objects.get(pk=pk)
user_id = request.user.id
user_username = request.user.username
if request.user.is_authenticated:
if "Like1" in request.POST and user_username not in song.music_1_users.keys():
song.music_1_votes += 1
song.music_1_users[user_username] = user_id
song.save()
return HttpResponse(song.music_1_votes)
elif "Unlike1" in request.POST and user_username in song.music_1_users.keys():
song.music_1_votes -= 1
song.music_1_users.pop(user_username)
song.save()
return HttpResponse(song.music_1_votes)
Мои изменения в URLS
path('ajax/', musician_likes_view, name="song_likes"),
Моя ошибка Вот ошибка, которую я получил в своей консоли
POST http://127.0.0.1:8000/guitar_blog/20/ajax/ 404 (Not Found)
Моя функция success в моем JavaScript файле не может получить доступ к JsonResponse или HttpResponse, она переходит в функцию Error Function. У меня нет данных для передачи в форму, кроме "csrf_token", так как это только для нажатия кнопки. Я обратился ко второму классу формы, который (".top_song") в javascript файле для отправки. Что я делаю не так?
Я решил свою проблему
Мой взгляд
class MusicianDetailView(DetailView):
model = Musician
template_name = "guitar_blog/blog_detail.html"
@login_required
def post_likes(request):
song = Musician.objects.get(pk=int(request.POST.get("primary_key")))
user_id = int(request.POST.get("user_id"))
user_username = request.POST.get("username")
if "Like1" in request.POST.get("button_name") and user_username not in song.music_1_users.keys():
song.music_1_votes += 1
song.music_1_users[user_username] = user_id
song.save()
return JsonResponse({"final": song.music_1_votes, "req_name": "Unlike1", "inner_text": "Unlike"})
elif "Unlike1" in request.POST.get("button_name") and user_username in song.music_1_users.keys():
song.music_1_votes -= 1
song.music_1_users.pop(user_username)
song.save()
return JsonResponse({"final": song.music_1_votes, "req_name": "Like1", "inner_text": "Like"})
Мой URL
path('likes/', post_likes, name="post_likes"),
Мой шаблон
<form method="post" class="voting-setup" id="top-song-form">
{% csrf_token %}
<input type="hidden" class="username" value="{{ user.get_username }}">
<input type="hidden" class="user_id" value="{{ user.id }}">
<input type="hidden" class="user" value="{{ user }}">
<input type="hidden" class="primary-key" value={{ musician.pk }}>
{% if user.get_username in musician.music_1_users %}
<button name="Unlike1" type="button" class="like-button top-song-button">
<i class="fa-solid fa-guitar icon"
><span class="like-text top-button-inside-text">Unlike</span></i
>
</button>
{% else %}
<button name="Like1" type="button" class="like-button top-song-button">
<i class="fa-solid fa-guitar icon"
><span class="like-text top-button-inside-text">Like</span></i
>
</button>
{% endif %}
<span class="after-like" id="top-song-vote-count">Liked {{ musician.music_1_votes }}</span>
</form>
Мой JS файл
$(".top-song-button").click(function (e) {
let data = {
"username": $(".username").val(),
"user_id": $(".user_id").val(),
"button_name": $(".top-song-button").attr("name"),
"primary_key": $(".primary-key").val(),
"user_set": $(".user").val(),
"csrfmiddlewaretoken": $("#top-song-form").serialize().split("=")[1],
}
e.preventDefault();
$.post('/likes/', data,
function (response) {
$("#top-song-vote-count").text("Liked " + response["final"]);
let my_button_text = document.querySelector(".top-button-inside-text");
let my_button = document.querySelector(".top-song-button");
my_button.name = response["req_name"];
my_button_text.innerText = response["inner_text"];
},
"json"
);
console.log(data);
});
Да, @shourav, вы правы насчет ошибки с csrf_token, но я сделал это по-другому, поскольку я просто передавал "csrf_token" через форму, поэтому сериализация получала только "csrf token". Также я сделал чертовски много изменений в этом ответе. Но все равно спасибо за помощь @shourav .