Не проходит запрос к Instagram API из тела страницы. Как исправить?

Question

[Drengr]

В целях обучения решил сделать простенькое веб-приложение, работающее с Instagram API. Суть такова: по клику на кнопке идет ajax-запрос к API и выводятся фото. В самом Instagram зарегистрировался, приложение подключил.
Вот такой код пытается получить хоть что-то от API:

var config = {};
config.Beget = {
		apiKey: 'xxx', // Здесь реальные данные из панели разработчика Instagram 
		clientID: 'xxx', // Здесь реальные данные из панели разработчика Instagram 
		apiHost: 'https://api.instagram.com/'
	};
$('.submit').click( // submit - класс кнопки-тригера
function getData() {
		var tag = 'snow';  // Определил здесь тег, по которому будет идти поиск, в целях упрощения дебага.
		var url = config.Beget.apiHost + 'v1/tags/' + tag + '/media/recent?access_token=' + config.Beget.apiKey; 
			$.ajax({
				dataType: 'jsonp',
				cache: false,
				url: url,
				 headers: {
				'Access-Control-Allow-Origin': '*'
				 },
				success: function(result) {document.write('REQUEST SENT: ' +result.data[0].type)},
				error: function(){console.log('Error!');}
			});
	}
);
	});

Так вот, если я ввожу этот код в консоли, то все в порядке, выполняется success.
Если просто запускаю сайт и кликаю по кнопке, то ничего не происходит.
Вкладка Network в Google Chrome показывает следующее:

Что это может быть и как это можно побороть? Заранее спасибо.

Answer 1

[Александр Зеленин]

не вижу у вас отключения стандартного сабмита формы через event.preventDefault();

Comments

[Drengr]

Спасибо, действительно забыл об этом. Выключил через onsubmit='function(); return false;'

Answer 2

[Drengr]

Как только вынес input и button из тега form, все стало на свои места. В любом случае интересует причина проблемы.