AjaxForm и Login
        Здравствуйте, неоднократно задавался вопрос «Можно ли прикрутить AjaxFrom к сниппетам Login?»
Но ответа нигде не нашел. Есть ли решение данного вопроса?
    
    
                                                                                
            Но ответа нигде не нашел. Есть ли решение данного вопроса?
Комментарии: 13
                Есть компонент Василия office
Там вроде через аякс авторизация
                    Там вроде через аякс авторизация
                Помогу с решением.
Вызываем сниппет Login:
Чанк формы для авторизации fastLoginTpl:
Чанк для вывода ошибки fastLoginError:
Скрипт js, обрабатывающий событие отправки формы (нужен подключенный jquery):
— я еще подключил плагин jgrowl для отправления алертов. В его же вызове group: «m-Error» — класс для всплывающего бокса (красный, с ошибкой).
Если jgrowl не нужен — то вместо него вставляем в поле для ошибок желаемый ответ. Пример:
#ajaxAuth .ajaxLoad — в моем примере форма с индикатором загрузки, которая появляется при обработке аякс-запроса.
                    Вызываем сниппет Login:
[[!Login? &loginTpl=`fastLoginTpl` &errTpl=`fastLoginError`]]Чанк формы для авторизации fastLoginTpl:
<div style="display: none;" id="authErrors">[[+errors]]</div>
<form class="loginForm" id="iWannaLogin" action="[[~[[*id]]]]" method="post">
	<div class="login">
		<input id="loginForm" name="username" class="roundInput" type="text" placeholder="Логин" title="Ваш логин">
	</div>
	<div class="password">
		<input id="passwordForm" name="password" class="roundInput" type="password" placeholder="Пароль" title="Ваш пароль">
	</div>
	
	<input class="returnUrl" type="hidden" name="returnUrl" value="[[+request_uri]]" />
	<input class="loginLoginValue" type="hidden" name="service" value="login" />
	
	<div class="submit">
		<a rel="nofollow" href="[[~17]]">Я - тупой, забыл пароль..</a>
		<input id="ajaxLoginButton" type="submit" name="Login" value="Войти" />
	</div>
</form>Чанк для вывода ошибки fastLoginError:
[[+msg]]Скрипт js, обрабатывающий событие отправки формы (нужен подключенный jquery):
<script type="text/javascript">
	$(document).ready(function(){
		$("#iWannaLogin").bind("submit", function() {
			$("#authErrors").text("");
		
			//здесь можно допилить подсветку полей с ошибкой
			if ($("#loginForm").val().length < 1 && $("#passwordForm").val().length < 1) {
				$.jGrowl("Введите логин и пароль", {group: "m-Error"});
				return false;
			}
			if ($("#loginForm").val().length < 1) {
				$.jGrowl("Введите логин", {group: "m-Error"});
				return false;
			}
			if ($("#passwordForm").val().length < 1) {
				$.jGrowl("Введите пароль", {group: "m-Error"});
				return false;
			}
			$.ajax({
				type: "POST",
				cache: false,
					url: "[[~[[*id]]]]",
				data: $(this).serializeArray(),
				beforeSend: function(){
					$("#ajaxAuth .closeBlock").css("display", "none");
					$("#ajaxAuth .ajaxLoad").css("display", "block");
					
					$("#ajaxLoginButton").prop("disabled", true);
				},
				success: function(data) {
					$("#ajaxAuth .closeBlock").css("display", "block");
					$("#ajaxAuth .ajaxLoad").css("display", "none");
			
					var errMessage = $(data).find("#authErrors").text();
				
					if(errMessage == ""){
						window.location = "адрес для переадресации при успешной авторизации";
					}
					else{
						$("#authErrors").text(errMessage);
						$.jGrowl($("#authErrors").text(), {group: "m-Error"});
					}
				},
				
				complete: function(){
					$("#ajaxLoginButton").prop("disabled", false);
				}
			});
			return false;
	
		});
	});
</script>— я еще подключил плагин jgrowl для отправления алертов. В его же вызове group: «m-Error» — класс для всплывающего бокса (красный, с ошибкой).
Если jgrowl не нужен — то вместо него вставляем в поле для ошибок желаемый ответ. Пример:
$("#authErrors").text("текст ошибки").css("display", "block");#ajaxAuth .ajaxLoad — в моем примере форма с индикатором загрузки, которая появляется при обработке аякс-запроса.
                Спасибо большое!            
                    
                Спасибо. Работает, но не совсем, как хотелось. при регистрации происходит редирект на страницу, а можно, чтобы просто блок перегрузился и все. Понятно что можно заменить window.location на .html()/ Только как туда передать чанк?            
                    
                Не нашли вариант авторизации без перезагрузки страницы?            
                    
                Для вообще ленивых :), авторизация Login по ajax:
                    Вызов:
[[!Login? &loginTpl=`lgnLoginTpl` &logoutTpl=`lgnLogoutTpl` &errTpl=`lgnErrTpl` &loginResourceId=`52` &logoutResourceId=`[[*id]]`]]
Форма:
<div class="loginForm">
    <div class="loginLogin">
        <div class="loginMessage">[[!+errors]]</div>
        <form class="loginLoginForm auth" action="[[~[[*id]]]]" method="post">
            <fieldset class="loginLoginFieldset">
                <label class="loginUsernameLabel" for="login">[[%login.username]]</label>
                <input class="loginUsername put-focus" type="text" name="username" id="login">
                <span class="error error-login"></span>
                
                <label class="loginPasswordLabel" for="pass">[[%login.password]]</label>
                <input class="loginPassword" type="password" name="password" id="pass">
                <span class="error error-password"></span>
                    
                <input class="loginRememberme" type="checkbox" name="rememberme" id="checkbox-1" checked>
                <label class="loginRemembermeLabel new-check" for="checkbox-1">Запомнить меня</label>
                
                <input class="loginLoginValue" type="hidden" name="service" value="login">
                <input type="submit" name="Login" value="[[+actionMsg]]">
                 
                <input class="returnUrl" type="hidden" name="returnUrl" value="[[+request_uri]]">
            </fieldset>
            <div class="text-center">
                <a class="forgot-login" href="[[~45]]">Забыли логин или пароль?</a>
            </div>
        </form>
    </div>
</div>
Скрипт:
<script>
        $(document).ready(function(){
            $(".auth").bind("submit", function() {
                $("span.error, .loginMessage").text("");
                $("input.error, textarea.error").removeClass('error');
                
                if ($(".loginUsername").val().length < 1 && $(".loginPassword").val().length < 1) {
                    $(".error-login").text("Для входа введите Ваш логин");
                    $(".error-password").text("Для входа введите Ваш пароль");
                    $('.loginUsername, .loginPassword').addClass('error');
                    return false;
                }
                
                if ($(".loginUsername").val().length < 1) {
                    $(".error-login").text("Для входа введите Ваш логин");
                    $('.loginUsername').addClass('error');
                    return false;
                }
                
                if ($(".loginPassword").val().length < 1) {
                    $(".error-password").text("Для входа введите Ваш пароль");
                    $('.loginPassword').addClass('error');
                    return false;
                }
                
                $.ajax({
                        type    : "POST",
                        cache   : false,
                        url     : "[[~[[*id]]]]",
                        data    : $(this).serializeArray(),
                        success: function(data) {
                            var errMessage = $(data).find(".loginMessage").text();
                            if(errMessage == ""){
                                window.location = "[[~[[*id]]]]";
                            }else{
                                $(".error-login").text('Неправильный логин или пароль');
                                $('.loginUsername, .loginPassword').addClass('error');
                            }
                        }
                });
        
                return false;
        	});
        });
    </script>            
                Скрипт можно вынести в отдельный файл. Если не указывать параметр url в $.ajax, функция автоматически отправит запрос на текущую страницу            
                    
                У меня работает такой вариант:
window.location = "[[~[[*id]]]]";
Можно также переназначить на любой документ:
window.location = "[[~85]]";
                    window.location = "[[~[[*id]]]]";
Можно также переназначить на любой документ:
window.location = "[[~85]]";
                Спасибо за пример кода. Все работает.
Можете подсказать как сделать обновление данных через UpdateProfile + ajax.
Заранее благодарен за любую помощь.
                    Можете подсказать как сделать обновление данных через UpdateProfile + ajax.
Заранее благодарен за любую помощь.
                AjaxForm + Register
modx.pro/help/19551
                    modx.pro/help/19551
                Не подскажете, как сделать обновление профиля и изменение пароля по Ajax, сниппеты UpdateProfile и ChangePassword, подобным образом?            
                    
                Есть недавно созданный замечательный компонент AjaxFormitLogin
                    {'!AjaxFormitLogin' | snippet : [
    'form' =>  'updateProfileForm',
    'snippet' => 'FormIt',
    'hooks' => 'AjaxIdentification',
    'method' => 'update',
    'successMessage' => 'Данные сохранены.',
    'clearFieldsOnSuccess' => 0,
    '-spamProtection' => 1
    'validate' => 'email:required:email',
    'validationErrorMessage' => 'Исправьте, пожалуйста, ошибки!',
    'email.vTextRequired' => 'Укажите email.'
]}            
                Спасибо            
                    
                            Авторизуйтесь или зарегистрируйтесь, чтобы оставлять комментарии.