Форма логина/регистрации/пароля в jquery табах. Рецепт

Аватар пользователя volocuga volocuga 7 февраля 2010 в 13:24

Кто-то тут спрашивал уже,как вывести поля логина,регистрации и напоминания пароля в "быстрых" вкладках (т.е переключаются без перезагрузки страницы). Я сегодня тоже озадачился и решение оказалось очень простым.

Это в page.tpl.php (у меня для этого есть отдельный шаблон page-user.tpl.php)

<?php if (!$user->uid): ?>
<div id="account-tabs-wrapper">
<ul class="account-tabs">
<li><a href="#" class="defaulttab" rel="register-tab"><?php print t('Register'); ?></a></li>
<li><a href="#" rel="login-tab"><?php print t('Log in'); ?></a></li>
<li><a href="#" rel="pass-tab"><?php print t('Forgot password'); ?></a></li>
</ul>
<div id="register-tab" class="tabs-content"><?php print drupal_get_form('user_register'); ?></div>
<div id="login-tab" class="tabs-content"><?php print drupal_get_form('user_login'); ?></div>
<div id="pass-tab" class="tabs-content"><?php print drupal_get_form('user_pass'); ?></div>
</div>
<?php endif; ?> 

Стили (рихтуем по вкусу)

<style type="text/css">

#account-tabs-wrapper {
    width:500px;
}
ul.account-tabs {
    width:350px;
    margin:0;
    padding:0;
}
ul.account-tabs li {
    display:block;
    float:left;
    padding:0 5px;
}
ul.account-tabs li a {
    display:block;
    float:left;
    padding:5px;
    font-size:0.8em;
    background-color:#e0e0e0;
    color:#666;
    text-decoration:none;
}
.selected {
    font-weight:bold;
}
.tabs-content {
        clear:both;
    border:1px solid #ddd;
    padding:10px;
}
</style>

Простейшая ява,вставляем между тегами head нашего шаблона:

<script type="text/javascript">
<!--
$(document).ready(function() {
 
        $('.account-tabs a').click(function(){
                switch_tabs($(this));
        });
 
        switch_tabs($('.defaulttab'));
 
});
 
function switch_tabs(obj)
{
        $('.tabs-content').hide();
        $('.account-tabs a').removeClass("selected");
        var id = obj.attr("rel");
 
        $('#'+id).show();
        obj.addClass("selected");
}
//-->
</script>

Notes:

1) В форме регистрации не работает проверка крепости и совпадения паролей. Но это скорее плюс - на орге даже есть модуль,который отключает вывод этих сообщений

2) не работает такая конструкция вывода системных сообщений (на случай если не заполнены обязательные поля)

<?php if ($messages): ?><?php print $messages?><?php endif; ?>

Зато работает такая

<?php print $messages?>

Комментарии

Аватар пользователя Stan.Ezersky Stan.Ezersky 7 февраля 2010 в 13:41

"volocuga" wrote:
$(document).ready(function() {
Возможен конфликт. Всё-таки прочитаем, дабы потом не удивляться, почему что-то не работает
"volocuga" wrote:
В форме регистрации не работает проверка крепости и совпадения паролей. Но это скорее плюс - на орге даже есть модуль,который отключает вывод этих сообщений
Это как это плюс? На д.орге есть модуль отключающий "сложность" пароля, но никак не совпадение!

Совпадение паролей должно работать обязательно (вдруг человек ошибся при вводе на один символ?).

Аватар пользователя volocuga volocuga 7 февраля 2010 в 14:54

Я там не знаю как кому,а меня эти перделки с проверкой "правильности" разражают - такое чувство,что держат за полного дыбила Smile

Скрипты с <?php$(document).ready(function() {?> у меня везде работают.

Аватар пользователя volocuga volocuga 7 февраля 2010 в 15:12

Ладно,drupal way

Drupal.behaviors.myModuleBehavior = function (context) {
//do some fancy stuff
};

Кто нибудь знает,как это использовать,чтобы включать независимые jquery?

Аватар пользователя Stan.Ezersky Stan.Ezersky 7 февраля 2010 в 15:58
Drupal.behaviors.switchtabBehavior = function (context) {
        $('.account-tabs a').click(function(){
                switch_tabs($(this));
        });
 
        switch_tabs($('.defaulttab'));
}
Аватар пользователя Stan.Ezersky Stan.Ezersky 7 февраля 2010 в 16:02
Drupal.behaviors.switchtabBehavior = function (context) {
        $('.account-tabs a').click(function(){
                switch_tabs($(this));
        });
 
        switch_tabs($('.defaulttab'));
}

"volocuga" wrote:
Простейшая ява,вставляем между тегами head нашего шаблона:
А зачем подгружать на каждой странице лишнее?

Аватар пользователя volocuga volocuga 7 февраля 2010 в 16:55

Ну так друпал сам по себе много всего лишнего грузит,а этот скриптец совсем крошечный. Впрочем,как уже говорил,у меня page-user.tpl.php,так что грузится только на user,user/*,users