Почему после отправки POST — запроса через AJAX идет перенаправление на localhost:8000/?

Question

[Артём Иннокентьев]

Использую JQuery AJAX и Django.

При нажатии кнопки "Добавить" отправляется POST-запрос (csrf token создается с помощью файла csrf.js, как в документации), исходный адрес локального серва - localhost:8000, после отправки запроса меняется на - localhost:8000/?. Почему это происходит?

Обрывок файла index.html:

<form>
    <input type = "text" id = "task_text"><input type = "submit" value = "Добавить" id = "add">
</form>

Обрывок файла index.js:

$('#add').click(function()
		{
			text = $('#task_text').val();

			$.ajax(
			{
				url: '/test/',
				type: 'POST',
				data: {task_text: text}, 
				success: function(text){
					console.log(text)
				},
			});
		});

Обрывок файла views.py:

def test(request):
	if request.is_ajax():
		r = request.POST['task_text']
		Task.objects.create(text = r)
		return redirect('/')
	else:
		message = "bad"
		return HttpResponse(message)

Если есть советы, критика кода - пожалуйста, пишите)

Также, есть сопутствующий вопрос:

• Можно ли использовать AJAX без формы <form> и <input type = "submit">, используя только <input type = "button"> и файл index.js?
  

Answer 1

[Алексей]

исходный адрес локального серва - localhost:8000, после отправки запроса меняется на - localhost:8000/?. Почему это происходит?

По всей видимости из за этой строки:
return redirect('/')

Можно ли использовать AJAX без формы

Можно, повесьте на кнопку обработчик нажатия и внутри отправляйте ajax запрос. Вы собственно так и делаете, поэтому форму можно просто удалить из разметки.

Answer 2

[Ivan Demidov]

$('#add').click(function()
    {
      text = $('#task_text').val();

      $.ajax(
      {
        url: '/test/',
        type: 'POST',
        data: {task_text: text}, 
        success: function(text){
          console.log(text)
        },

        return false;
 
      });
    });

И лучше вешать слушатель на форму и слушать submit

По сопутсвующему - можно.

Comments

[Артём Иннокентьев]

s50.radikal.ru/i130/1509/e7/b7e6d7b5a759.png

[Артём Иннокентьев]

"И лучше вешать слушатель на форму и слушать submit"
Можно подробнее?

[Ivan Demidov]

В случае если форма все таки должна присутсвовать толучше слушать событие sabmit у форму т.е. $('#myForm').on('submit', function(event){ производим валидацию чего либо и если все хорошо то ничего не делаем и форма отправит данные указанные в атрибута action если такого нет то данные пролетят на тот урл который в данный момент е если валидацию не прошла говорим return false или event.preventDefault()

Answer 3

[Артём Клименко]

ещё на данный момент обратите внимание djbook.ru/rel1.8/ref/settings.html#append-slash

Answer 4

[Владислав Скляр]

У вас у вьюхе прописано же:
return redirect('/')
Пропишите

success: function(text){
          alert(response['msg'])
        },

А во вьюхе:

msg_value = 'Your text is add!'
response_data['msg'] = unicode(msg_value)
return JsonResponse(response_data)