Ограничение символов в форме добавление комментариев
827материалов
228тем на форуме
3004комментария
6160пользователей

Ограничение символов в форме добавление комментариев


Всем массовый привет, сегодня мы будем создавать для формы добавление комментариев очередное обновление, как вы поняли по заголовку данной темы речь идёт об ограничение символов в форме добавление комментариев.

В отличии от многих других решений, основным плюсом данного решения является тот момент, что пользователь не сможет вписать символов больше установленного ограничения, текст будет просто обрезаться.

Шаг 1 - Установим JS:
И так, нам необходимо в самый низ страницы сайта, перед закрывающим тегом </body>, установить следующий js:

JS
Код
<script type="text/javascript" src="http://webo4ka.ru/Ucoz8/characters_limit.js"></script>

в данном скрипте стоит ограничение на ввод 50 символов, вы устанавливаете свой лимит ограничений, изменив в js и html коде ниже, значение 50

Шаг 2 - Установим HTML:
теперь идём в Админ панель => Дизайн => Управление дизайном => Комментарии => Форма добавления комментариев и ищим следующий html код:

HTML
Код
<textarea class="commFl" style="height:135px;" rows="8" name="message" id="message" cols="50">$MESSAGE$</textarea>

который мы удаляем и за место него устанавливаем новый html код:

HTML
Код
<div class="comment-message">    
<textarea class="commFl" style="height:135px;" rows="8" name="message" id="message" cols="50">$MESSAGE$</textarea>    
    <div class="comment-messag-symbol">Осталось символов: <strong id="comment-symbol">50</strong></div>    
    </div>

Шаг 3 - Установим CSS:
А теперь давайте установим следующие css стили для правильного отображение нашего с вами решения:

CSS
Код
/* Основные стили страницы    
------------------------------------------*/    
.comment-message {    
    width:500px;    
}    

.comment-message textarea {    
    width:476px!important;    
    padding: 5px 10px;    
    background:#fff!important;    
    border: 2px solid #cad3da!important;    
    font:11px Verdana,Arial,Helvetica, sans-serif;    
    color:#555 !important;    
    border-radius:3px!important;    
}    

.comment-messag-symbol{    
    float:right;    
    margin-top: 5px;    
}

обратите внимание, что в данных стилях я стилизовал также и форму добавление комментариев их можно удалить и подогнать размер ячейки уже редактируя свои css стили сайта.

На этом всё, спасибо за внимание!

ПОСМОТРЕТЬ ДЕМО ЗАКАЗАТЬ УСТАНОВКУ

Скрипт опубликовал:
...
Логин на сайте: ...
Группа: ...
Статус: ...
Информация о скрипте:
Дата добавления материала: 24.08.2013 в 01:17
Материал просмотрен: 581 раз
Категория материала: Скрипты для uCoz
К материалу оставлено: 0 комментариев

Пожаловаться
Сказать спасибо
Источник

0 комментариев


avatar
Вход через социальные сети
Работа в компании uCoz
uSocial - социальные кнопки
uLike – кнопка «Мне нравится»
Статистики нашего сайта