Попытка открыть новое окно браузера в моем вызове с вызовом ajax, однако, он заблокирован как всплывающее окно. Я сделал несколько поисков и обнаружил, что пользовательское событие должно быть привязано к окну .open, чтобы этого не произошло.
Я также нашел это решение, в котором вы открываете пустое окно перед ajax, затем загружаете URL-адрес, как обычно, в вызов успеха.
Итак, у меня есть два вопроса:
1 - Это единственное решение, потому что я бы предпочел не открывать это пустое окно.
2 - Если это действительно единственный способ, то как я могу добавить load html в это новое окно? Например, если мой аякс не удался, как я могу добавить текст ошибки в это пустое окно, так как URL-адрес не будет открыт?
Я также должен отметить, что я не хочу, чтобы вызов ajax был синхронным... это побеждает цель ajax, и я считаю, что это будет устаревать, если не будет... исправьте меня, если я буду неправильно читать поиск.
$('#user-login').on('click', function () {
var $form = $(this).closest('form');
window.open('about:blank', 'myNewPage');
$.ajax({
type: 'post',
url: '/spc_admin/process/p_user_login.php',
data: $form.serialize(),
dataType : 'json'
}).done(function (response) {
$myElem = $('#user_login_message'); //performance for not checking dom
$myElem.fadeOut('fast', function(){
if (response.success)
{
$myElem.html('<p><b class="text-blue">Success!</b> You have been logged in as \'<b>'+response.username+'</b>\' in a new browser window.</p>').fadeIn('fast');
// open new window as logged in user
//window.open('http://www.example.com/');
window.open('http://www.example.com/', 'myNewPage');
}
else
{
$myElem.html('<p><b class="text-red">Error!</b> Please select a valid user from the dropdown list.</p>').fadeIn('fast');
}
});
});
});
EDIT:
Для всех, кого это интересует... вот решение, которое я придумал. Для нового окна требуется имя, чтобы в одном окне открывались последовательные клики и не открывались новые. Добавление html немного отличается от заданного в ответе, и это работает. Размытие окна не работает, так что его нет. Из того, что я мог обнаружить, это не контролируемо и является браузером.
$('#user-login').on('click', function () {
var $form = $(this).closest('form');
//open blank window onclick to prevent popup blocker
var loginWindow = window.open('', 'UserLogin');
$.ajax({
type: 'post',
url: '/spc_admin/process/p_user_login.php',
data: $form.serialize(),
dataType : 'json'
}).done(function (response) {
$myElem = $('#user_login_message'); //performance for not checking dom
$myElem.fadeOut('fast', function(){
if (response.success)
{
// show success
$myElem.html('<p><b class="text-blue">Success!</b> You have been logged in as \'<b>'+response.username+'</b>\' in a new browser window.</p>').fadeIn('fast');
// open new window as logged in user
loginWindow.location.href = 'http://www.example.com/';
}
else
{
// show error
$myElem.html('<p><b class="text-red">Error!</b> Please select a valid user from the dropdown list.</p>').fadeIn('fast');
// add error to the new window (change this to load error page)
loginWindow.document.body.innerHTML = '<p><b>Error!</b> Please select a valid user from the dropdown list.</p>';
}
});
});