Почему не закрывается форма после отправки?

Question

[WebforSelf]

<spoiler title="">
    (function($){
        'use strict';
        
        var name, id, img;
        
        $('.js-one-click').on('click', function(e){
            e.preventDefault();
            
            var $btn = $(this);
            
            name = $btn.data('name');
            id = $btn.data('id');
            img = $btn.data('img');
                
            $('#oneclick-product').text(name);
            $('#oneclick-image').css('background-image', 'url(' + img + ')');

          
 $.fancybox.open({
	src  : '#oneclick',
	type : 'inline'
});
		  
        });
        
        $('#oneclick').on('submit', function(e){
            e.preventDefault();
 
            $.ajax({
                type: "post",
                url: "ajax/oneclick.php",
                data: {
                    'amount': 1, 
                    'variant': id,
                    'name': $('#oneclick-name').val(),
                    'phone': $('#oneclick-phone').val() 
                },
                dataType: 'json',
                success: function(data){
                $.fancybox.close();
                }
            });
        });
        
    })(window.jQuery);
</spoiler>

Есть код, собственно что он делает, при нажатии на кнопку собирает дата аттрибуты и открывает модальное окно,
При кнопке отправить, отправляет данные и должен закрывать всплывающее окно ( в идеале конечно во всплывающем окне выводить текст что принята форма и потом через 2-3 сек выключаться) в принципе реализуемо на jquery но сейчас даже не закрывает при отправке. Где ошибся?

Comments

[yarnstart]

Вы уверены, что аякс запрос выполняется успешно ? (success)
Может в скрипте на сервере ошибка ? Поставьте console.log(data) в success callback

[yarnstart]

Ещё у вас урл указан "ajax/onclick.php". У вас одностраничный сайт ? Если нет тогда данный скрипт будет только по одному конкретному url работать, лучше указывать относительный путь

[WebforSelf]

Евгений, да, форма приходит по назначению, а вот даже

console.log(data) почему то не выводит значения

[WebforSelf]

Евгений, не, с тем файлом все хорошо, форма уходит и приходят данные.

[yarnstart]

WebforSelf, какие значения он не выводит ? Он впринципе отрабатывает ? Хотя бы undefined показывает ? Если сервер возвращает не 200 код, то будет срабатывать error callback, а не success

[yarnstart]

WebforSelf, Форма может и уходит, но скрипт может отдавать неправильный код ответа обратно на клиент и тогда будет срабатывать не success: function, а error: function

[WebforSelf]

Евгений, так и есть, срабатывает error, а из за чего может быть?

[yarnstart]

WebforSelf, скорее всего неправильный код ответа, нужен 200, чтобы он был success

[WebforSelf]

Евгений, а что ему может не хватать? я просто передаю набор переменных с дата атрибутов.

[yarnstart]

WebforSelf, верните 200 OK ответ с сервера
header("HTTP/1.0 200 OK");

Почитайте про http коды ответа

[WebforSelf]

Евгений,
Вот что логи выводят

[yarnstart]

WebforSelf, вам в error callback должен возвращаться объект jquery, в котором должен быть указан status. Скорее всего он 5**

[WebforSelf]

Евгений, а как мне его поймать?

в error написать console.log(data); ?

[WebforSelf]

Евгений,

$.ajax({
                type: "post",
                url: "ajax/oneclick.php",
                data: {
                    'amount': 1, 
                    'variant': id,
                    'address': $('#oneclick-address').val(),
                    'phone': $('#oneclick-phone').val() 
                },
                dataType: 'json',
                error: function(data){
             	console.log(data);
                }

            });

[yarnstart]

WebforSelf, да

error: function (jqXHR, exception) {
  console.log(jqXHR, exception);
}

[yarnstart]

WebforSelf, так вам возвращается 200 ОК, значит всё норм, этот ответ пришел в success или в error ?

[WebforSelf]

Евгений, это с эррор возвращается 200

[yarnstart]

WebforSelf, У вас указан dataType: 'json', а сервер возвращает не json, поэтому jquery кидает его в error.
Попробуйте убрать dataType вообще.

[WebforSelf]

Евгений,

Вот это смущает, ну а почему не json то

[yarnstart]

WebforSelf, responseText: "", пустая строка, попробуйте либо убрать dataType либо
echo json_encode([1 => 1], true);

В конце php скрипта

[WebforSelf]

Евгений, данное решение помогло, теперь возвращает success , спасибо

Только я не пойму почему не в json , данное решение на другом сайте работает без проблем. А тут вот такая дичь

[yarnstart]

WebforSelf, Вы говорите jquery, что сервер вам точно вернет json, а он возвращает вам пустую строку.
Выполните код
JSON.parse('');
Он даст ошибку, джейквери выполняет этот код за вас, чтобы вам не пришлось руками писать JSON.parse(data) каждый раз, но т.к. данный скрипт падает ошибкой, срабатывает error callback

В коде, который вы видели на другом сайте с сервера может возвращаться настоящий json, либо там была другая версия jquery (потенциально возможно)

Если не уверены, что сервер вернет определенный формат данных либо вернет их вообще, просто не указывайте dataType

[WebforSelf]

Евгений, Спасибо , вы очень выручили!

Answer 1

[yarnstart]

Для тех, кто сюда попал:

Вы говорите jquery, что сервер вам точно вернет json, а он возвращает вам пустую строку.
Выполните код
JSON.parse('');
Он даст ошибку, джейквери выполняет этот код за вас, чтобы вам не пришлось руками писатьJSON.parse(data) каждый раз, но т.к. данный скрипт падает ошибкой, срабатывает error callback

В коде, который вы видели на другом сайте с сервера может возвращаться настоящий json, либо там была другая версия jquery (потенциально возможно)

Если не уверены, что сервер вернет определенный формат данных либо вернет их вообще, просто не указывайте dataType.