Исчезающие подсказки (не tooltip)

@_include · Регистрация: 17.09.2012

Студворк — интернет-сервис помощи студентам

Добрый день!
Подскажите в какую сторону копать...
Пишу небольшой сайт для "домашней сети". Имеется раздел новости - соответственно возможность добавлять, удалять, изменять статьи. Статья добавляется в форме. Можно ли сделать подсказки как в Joomla? - Т.е. если я заполнил не все поля и нажал кнопку отправки статьи, то мне бы "приплыла" подсказка: "невозможно добавить, так как бла бла...". Без обновления страницы, что бы информация на странице сохранялась после такого алерта.
Еще решение проблемы вижу в подсветке поля ввода которое осталось пустым. но как реализовать не знаю..
Всем спасибо!

@Tatikoma · 07.07.2014, 23:13

Сообщение от _include

Можно ли сделать подсказки как в Joomla?

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

Реализуется это следующим образом:
1. Ставим обработчик события отправки формы: <form ... onsubmit="return form_validator.call(this)">
2. Пишем код обработчика:

JavaScript
1
2
3
4
5
6
7
8
9
10
function form_validator(){
    // проверяем что-нибудь, что вам нужно, например:
    if(this.name.value.length == 0){
        // выводим ошибку
        alert('Нужно заполнить поле "name"!');
        // отменяем отправку данных
        return false;
    }
    return true;
}

@nikolay1982 · 08.07.2014, 00:46

Можно сделать всплывающие подсказки с использованием CSS на JavaScript. Идея: использовать div с display:none, position: fixed(не static), top и left определены(или bottom/right), да и еще и использовать z-index больший, остальных элементов. И в коде js присваивать document.getElementById('my_popup').styl e.display='block' когда нужно всплывающее окно.
Альтернатива: не заморачиваться, а использовать готовую библиотеку типа bPopup(http://dinbror.dk/bpopup/). Требует jQuery.
Или что-то аналогичное.

@_include · 08.07.2014, 14:41 **[ТС]**

nikolay1982, Каким образом использовать бибилиотеку?

Добавлено через 6 минут
У меня есть некоторый код на php. если он выполняется, то я должен вывести сообщение и ссылку внутри окна. Пока что идя по документации с сайта, не получается вызывать даже оконце
И мне не подходит <button></button> я работаю с формой

@nikolay1982 · 08.07.2014, 17:47

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
<style>
.popup{
    display:none;/*для popup обязательно!*/
    background:yellow;
    color:white;
    border: 4px solid grey;
    padding:20;
}
    </style>
...
<p><a href="#" onclick="enter_popup('sample message!')">Sample popup</a></p>
<div id="popup1" class="popup" >
</div>

JavaScript
1
2
3
4
5
6
7
function enter_popup(text){
    var obj=$(".popup");
    obj.html(text);
    obj.bPopup({
        opacity: 0.0
    });
}

только это модальный popup.

Новые блоги и статьи Все статьи Все блоги /
Установка Qt Creator для C и C++: ставим среду, CMake и MinGW без фреймворка Qt 8Observer8 05.04.2026 Среду разработки Qt Creator можно установить без фреймворка Qt. Есть отдельный репозиторий для этой среды: https:/ / github. com/ qt-creator/ qt-creator, где можно скачать установщик, на вкладке Releases:. . .	AkelPad-скрипты, структуры, и немного лирики.. testuser2 05.04.2026 Такая программа, как AkelPad существует уже давно, и также давно существуют скрипты под нее. Тем не менее, прога живет, периодически что-то не спеша дополняется, улучшается. Что меня в первую очередь. . .	Отображение реквизитов в документе по условию и контроль их заполнения Maks 04.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа "ПланированиеСпецтехники", разработанного в конфигурации КА2. Данный документ берёт данные из другого нетипового документа. . .	Фото всей Земли с борта корабля Orion миссии Artemis II kumehtar 04.04.2026 Это первое подобное фото сделанное человеком за 50 лет. Снимок называют новым вариантом легендарной фотографии «The Blue Marble» 1972 года, сделанной с борта корабля «Аполлон-17». Новое фото. . .
Вывод диалогового окна перед закрытием, если документ не проведён Maks 04.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа "СписаниеМатериалов", разработанного в конфигурации КА2. Задача: реализовать программный контроль на предмет проведения документа. . .	Программный контроль заполнения реквизитов табличной части документа Maks 02.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа "СписаниеМатериалов", разработанного в конфигурации КА2. Задача: 1. Реализовать контроль заполнения реквизита. . .	wmic не является внутренней или внешней командой Maks 02.04.2026 Решение: DISM / Online / Add-Capability / CapabilityName:WMIC~~~~ Отсюда: https:/ / winitpro. ru/ index. php/ 2025/ 02/ 14/ komanda-wmic-ne-naydena/	Программная установка даты и запрет ее изменения Maks 02.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа "СписаниеМатериалов", разработанного в конфигурации КА2. Задача: при создании документов установить период списания автоматически. . .

@_include Студент 56 / 56 / 38 Регистрация: 17.09.2012 Сообщений: 292 Записей в блоге: 2

	Исчезающие подсказки (не tooltip) 07.07.2014, 22:24. Показов 2550. Ответов 4 Метки алерты, выделение поля, подсказки (Все метки) Добрый день! Подскажите в какую сторону копать... Пишу небольшой сайт для "домашней сети". Имеется раздел новости - соответственно возможность добавлять, удалять, изменять статьи. Статья добавляется в форме. Можно ли сделать подсказки как в Joomla? - Т.е. если я заполнил не все поля и нажал кнопку отправки статьи, то мне бы "приплыла" подсказка: "невозможно добавить, так как бла бла...". Без обновления страницы, что бы информация на странице сохранялась после такого алерта. Еще решение проблемы вижу в подсветке поля ввода которое осталось пустым. но как реализовать не знаю.. Всем спасибо! 0

@nikolay1982 128 / 126 / 60 Регистрация: 22.01.2014 Сообщений: 464
	08.07.2014, 00:46
	Сообщение было отмечено _include как решение Решение Можно сделать всплывающие подсказки с использованием CSS на JavaScript. Идея: использовать div с display:none, position: fixed(не static), top и left определены(или bottom/right), да и еще и использовать z-index больший, остальных элементов. И в коде js присваивать document.getElementById('my_popup').styl e.display='block' когда нужно всплывающее окно. Альтернатива: не заморачиваться, а использовать готовую библиотеку типа bPopup(http://dinbror.dk/bpopup/). Требует jQuery. Или что-то аналогичное. 1

@_include Студент 56 / 56 / 38 Регистрация: 17.09.2012 Сообщений: 292 Записей в блоге: 2
	08.07.2014, 14:41 [ТС]
	nikolay1982, Каким образом использовать бибилиотеку? Добавлено через 6 минут У меня есть некоторый код на php. если он выполняется, то я должен вывести сообщение и ссылку внутри окна. Пока что идя по документации с сайта, не получается вызывать даже оконце И мне не подходит <button></button> я работаю с формой 0

Исчезающие подсказки (не tooltip)

Решение

Решение