var ajaxgo = false; // глобальная переменная, чтобы проверять обрабатывается ли в данный момент другой запрос
jQuery(document).ready(function(){ // после загрузки DOM
var userform = jQuery('.userform'); // пишем в переменную все формы с классом userform
function req_go(data, form, options) { // ф-я срабатывающая перед отправкой
if (ajaxgo) { // если какой либо запрос уже был отправлен
form.find('.response').html('<p class="error">Необходимо дождаться ответа от предыдущего запроса.</p>'); // в див для ответов напишем ошибку
return false; // и ничего не будет делать
}
form.find('input[type="submit"]').attr('disabled', 'disabled').val('Подождите..'); // выключаем кнопку и пишем чтоб подождали
form.find('.response').html(''); // опусташаем див с ответом
ajaxgo = true; // записываем в переменную что аякс запрос ушел
}
function req_come(data, statusText, xhr, form) { // ф-я срабатывающая после того как пришел ответ от сервера, внутри data будет json объект с ответом
console.log(arguments); // это для дебага
if (data.success) { // если все хорошо и ошибок нет
var response = '<p class="success">'+data.data.message+'</p>'; // пишем ответ в <p> с классом success
form.find('input[type="submit"]').val('Готово'); // в кнопку напишем Готово
} else { // если есть ошибка
var response = '<p class="error">'+data.data.message+'</p>'; // пишем ответ в <p> с классом error
form.find('input[type="submit"]').prop('disabled', false).val('Отправить'); // снова включим кнопку
}
form.find('.response').html(response); // выводим ответ
if (data.data.redirect) window.location.href = data.data.redirect; // если передан redirect, делаем перенаправление
ajaxgo = false; // аякс запрос выполнен можно выполнять следующий
}
var args = { // аргументы чтобы прикрепить аякс отправку к форме
dataType: 'json', // ответ будем ждать в json формате
beforeSubmit: req_go, // ф-я которая сработает перед отправкой
success: req_come, // ф-я которая сработает после того как придет ответ от сервера
error: function(data) {
console.log(arguments);
},
url: ajax_var.url // куда отправляем, задается в wp_localize_script
};
userform.ajaxForm(args); // крепим аякс к формам
jQuery('.logout').click(function(e){ // ловим клие по ссылке "выйти"
e.preventDefault(); // выключаем стандартное поведение
if (ajaxgo) return false; // если в данный момент обрабатывается другой запрос то ничего не делаем
var lnk = jQuery(this); // запишем ссылку в переменную
jQuery.ajax({ // инициализируем аякс
type: 'POST', // шлем постом
url: ajax_var.url, // куда шлем
dataType: 'json', // ответ ждем в json
data: 'action=logout_me&nonce='+jQuery(this).data('nonce'), // что отправляем
beforeSend: function(data) { // перед отправкой
lnk.text('Подождите...'); // напишем чтоб подождали
ajaxgo = true; // аякс отпраляется
},
success: function(data){ // после того как ответ пришел
if (data.success) { // если ошибок нет
lnk.text('Выходим...'); // пишем что выходим
window.location.reload(true); // и обновляемся
} else { // если ошибки есть
alert(data.data.message); // просто покажим их алертом
}
},
error: function (xhr, ajaxOptions, thrownError) { // для дебага
alert(arguments);
},
complete: function(data) { // при любом исходе
ajaxgo = false; // аякс больше не выполняется
}
});
});
});<?php
/**
* Template Name: Страница профиля
*/
get_header();
?>
<?php if ( have_posts() ) while ( have_posts() ) : the_post(); // старт цикла ?>
<div class="container" id="post-<?php the_ID(); ?>" <?php post_class(); ?>> <?php // контэйнер с классами и id ?>
<h1><?php the_title(); // заголовок ?></h1>
<?php the_content(); // контент ?>
</div>
<?php if (!is_user_logged_in()) { // если юзер не залогинен, форму показывать не будем ?>
<p>У вас нет доступа к этой странице.</p>
<?php } else { // если залогинен, показываем страницу профиля
global $current_user; // заглобалим переменную с объектом данных текущего пользователя
$user = get_user_by('login', $current_user->user_login);
$user_id = $user->ID;
?>
<div class="container d-flex">
<form name="profileform" id="profileform" method="post" class="userform" action=""> <!-- обратите внимание на класс, по этому классу на форму вешается обработка -->
<div class="prof-avatar">
<p>Страница профиля пользователя: <?php echo $current_user->user_login; ?></p>
<p>Аватар:</p>
<style>
img {
margin: 0 auto;
}
</style>
<?php echo get_avatar($current_user->ID,64);?>
Загрузить новый аватар: <input type="file" name="avatar" id="avatar">
</div>
<div class="mt-5"></div>
<input type="email" name="user_email" id="user_email" placeholder="Email" value="<?php echo $current_user->user_email; ?>" required><!-- ну тут всякие обычные поля -->
<input type="text" name="first_name" id="first_name" placeholder="Имя" value="<?php echo $current_user->first_name; ?>">
<input type="text" name="last_name" id="last_name" placeholder="Фамилия" value="<?php echo $current_user->last_name; ?>">
<input type="text" name="user_url" id="user_url" placeholder="Сайт" value="<?php echo $current_user->user_url; ?>">
(!Здесь кастомное поле!)<input type="text" name="post" id="post" placeholder="Должность" value="<?php echo get_the_author_meta( '_post' ,$user_id);?>">
(!Здесь кастомное поле!)<input type="text" name="age" id="age" placeholder="Возраст" value="<?php echo get_the_author_meta( '_age' ,$user_id);?>">
(!Здесь кастомное поле!)<input type="text" name="number" id="number" placeholder="Номер телефона" value="<?php echo get_the_author_meta( '_number' ,$user_id);?>"></b>
<div class="mt-1"></div>
<textarea name="description" placeholder="Обо мне"><?php echo $current_user->description; ?></textarea>
<div class="mt-5"></div>
<div class="change-pass">
<p>Изменить пароль:</p>
<input type="password" name="current_pass" id="current_pass" placeholder="Текущий пароль"><!-- если захотят поменять пароль, надо будет заполнить все 3 поля -->
<input type="password" name="pass1" id="pass1" placeholder="Новый пароль">
<input type="password" name="pass2" id="pass2" placeholder="Повторите новый пароль">
</div>
<div class="mt-5 change">
<input type="submit" value="Изменить">
</div>
<input type="hidden" name="redirect_to" value="<?php echo $_SERVER['REQUEST_URI']; ?>"> <!-- куда отправим юзера если все прошло ок, в нашем случае это не понадобиться, а вообще может если форма сквозная -->
<input type="hidden" name="nonce" value="<?php echo wp_create_nonce('edit_profile_nonce'); ?>"> <!-- поле со строкой безопасности, будем проверять её в обработчике чтобы убедиться, что форма отправлена откуда надо -->
<input type="hidden" name="action" value="edit_profile"> <!-- обязательное поле, по нему запустится нужная функция -->
<div class="response"></div> <!-- ну сюда будем пихать ответ от сервера -->
</form>
</div>
<?php } ?>
<?php endwhile; // конец цикла ?>
</section>
<?php get_sidebar(); // подключаем sidebar.php ?>
<?php get_footer(); // подключаем footer.php ?>
$number = iseet($_POST['_number']) ? $_POST['_number'] : '';<input type="text" name="post" id="post" placeholder="Должность" value="<?php echo get_the_author_meta( '_post' ,$user_id);?>"><input type="text" name="_post" id="_post" placeholder="Должность" value="<?php echo get_the_author_meta( '_post' ,$user_id);?>">update_user_meta($user_id, '_post', $post );. И так со всеми кастомными полями.
Сложный
Простой
Средний
