В общем, говорю сразу, скорее всего это я напортачил или просто не до конца понимаю как все работает.
Есть на сайте кнопка входа, по нажатию на которую появляется окошко с формой:
Вот сама форма:
<form class="form-horizontal" method="post" id="authajax">
<div class="form-group">
<div class="col-lg-12">
<input type="text" class="form-control" name="login" placeholder="Логин">
</div>
</div>
<div class="form-group">
<div class="col-lg-12">
<input type="password" class="form-control form-control-bottom" name="password" placeholder="Пароль">
<p class="input-error text-danger">Неверный логин или пароль</p>
<div class="checkbox">
<label>
<input type="checkbox"> Запомнить меня
</label>
</div>
<button type="submit" class="btn btn-primary btn-right">Отправить</button>
</div>
</div>
</form>
Это обработка нажатия кнопки для появления формы:
$('#auth-a').click(function(e){
e.preventDefault();
if (!$(this).siblings('form').hasClass('open')) {
$(this).siblings('form').fadeIn().addClass('open');
}
else{
$(this).siblings('form').fadeOut().removeClass('open');
}
});
А это ajax обработка этой формы:
$("#authajax").submit(function(){
var form = $(this),
error = false,
subW = form.find('button[type="submit"]').width(),
subH = form.find('button[type="submit"]').height();
form.find('input').each( function(){
if ($(this).val() == '') {
$(this).css('border', '1px solid #d9534f');
form.find('.input-error').text('Заполните все поля').fadeIn();
error = true;
}
else if($(this).val() != ''){
$(this).css('border', '0');
}
});
if (!error) {
form.find('input').each( function(){
$(this).css('border', '0');
});
var data = form.serialize();
$.ajax({
type: 'POST',
url: 'proverka.php',
dataType: 'json',
data: data,
beforeSend: function(data){
form.find('button[type="submit"]').width(subW).height(subH).html('<i class="fa fa-spinner fa-spin"></i>');
},
success: function(data){
if (data['error']){
form.find('.input-error').text('Неверный логин или пароль').fadeIn();
}
else{
form.fadeOut();
$('#auth').prepend(data['message']);
$('#auth-a').remove();
}
},
complete: function(data){
form.find('button[type="submit"]').width('').height('').html('Отправить');
}
});
}
return false;
});
Обработчик скидывать не буду, там все стандартно.
Все отлично работает, я захожу на акк без перезагрузки, но потом, если на нажму на кнопку выхода, которая добавляется вот здесь $('#auth').prepend(data['message']); (в data['message'] лежит обычная строка Добро пожаловать, '.$_SESSION['login'] . ') код js не срабатывает, выход с акка не происходит, хотя вот ивент на нажатие кнопки выхода:
$('#sign-out').click(function(e){
$.ajax({
type: 'POST',
url: 'exit.php',
dataType: 'json',
success: function(data){
if (!data['error']){
$('#auth>p:first-child').remove();
$('#auth').prepend('<a href="#" id="auth-a">Вход <i class="fa fa-plug"></i></a>');
}
}
});
return false;
});
Почему не работает, я не понимаю, но самое интересное, что если я обновлю страницу, то выход сработает, но потом не будет работать событие по нажатию на кнопку входа, форма не будет появляться.
Помогите пожалуйста, подскажите где я напортачил, что не так понял?
Заранее спасибо!