Правила     Закладки     Карма    Календарь    Журналы    Помощь    Поиск    PDA    Чат   
        СМС-ки
   
Пейджер выключен!
 
Фильтр авторов:    показать 
  скрыть
  Ответ в темуСоздание новой темыСоздание опроса

> Скрытие элемента если нажали на другое место
matroskin777  
 ۩  [x] Дата
Цитировать сообщение

Пользователя сейчас нет на форуме



Новичок
*

Профиль
Группа: Пользователь
Сообщений: 9
Пользователь №: 42306
На форуме: 11 месяцев, 8 дней
Карма:




На сайт привязал коллендарь в поле input
в meta тегал прописал
<script language="JavaScript"
type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js"></script>
<
script language="javascript" type="text/javascript" src="http://rche.ru/examples/cal.js"></script>
<
script type="text/javascript">
$(document).ready(function(){
$('#calendar').simpleDatepicker(); // Привязать вызов календаря к полю с CSS идентификатором #calendar
$('#calendar2').simpleDatepicker();
});
$("body").click(function(e) {

if($(e.target).closest("#calenda").length==0) $("#calenda2").css("display","none");

});
</
script>


в поля прописал
Начать с:<input  id="calendar"  class="txtfldorder" type = "text" name = "s_data" value ="{bases_data}">
Закончить до:<input id="calendar2" class="txtfldorder" type = "text" name = "do_data" value ="{basedo_data}">


Не получается сделать чтобы формы календарей скрывались если нажимаю на другие места на странице.
Если кто умеет подскажите. Спасибо.
PMПисьмо на e-mail пользователю
    0   Для быстрого поиска похожих сообщений выделите 1-2 слова в тексте и нажмите сюда Для быстрой цитаты из этого сообщения выделите текст и нажмите сюда
sektor-sumy  
Дата
Цитировать сообщение

Пользователя сейчас нет на форуме



Новичок
*

Профиль
Группа: Пользователь
Сообщений: 33
Пользователь №: 42296
На форуме: 11 месяцев, 9 дней
Карма:




$('.datepicker').hide(); может как то так, но в данном датапикере надо смотреть евенты. по идее там должны быть такие опции
PMПисьмо на e-mail пользователю
    0   Для быстрого поиска похожих сообщений выделите 1-2 слова в тексте и нажмите сюда Для быстрой цитаты из этого сообщения выделите текст и нажмите сюда
Медведь  
Дата
Цитировать сообщение

Пользователя сейчас нет на форуме



Здесь живет
******

Профиль
Группа: ★ЛжеЭксперт★
Завсегдатай форума
Сообщений: 2482
Пользователь №: 37963
На форуме: 3 года, 3 месяца, 22 дня
Карма: 27




style.display = 'none'
В скрипте, при определённом условии.


--------------------

Заходил 29.09.2016
PMПисьмо на e-mail пользователю
    0   Для быстрого поиска похожих сообщений выделите 1-2 слова в тексте и нажмите сюда Для быстрой цитаты из этого сообщения выделите текст и нажмите сюда
sergeiss  
Дата
Цитировать сообщение

Пользователя сейчас нет на форуме



Сидел он, дум великих полон - и вдаль глядел
******

Профиль
Группа: Эксперт
Группа переписки
Сообщений: 14962
Пользователь №: 4190
На форуме: 8 лет, 9 месяцев, 25 дней
Карма: 443




Цитата (matroskin777 @ 24.12.2015 - 16:47)
Не получается сделать чтобы формы календарей скрывались если нажимаю на другие места на странице.

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


--------------------
* Хэлп по PHP
* Описалово по JavaScript
* Хэлп и СУБД для PostgreSQL

* Обучаю PHP, JS, вёрстке. Интерактивно и качественно. За разумные деньги.

* "накапливаю умение телепатии" (С) и "гуглю за ваш счет" (С)

user posted image
PMICQ
    0   Для быстрого поиска похожих сообщений выделите 1-2 слова в тексте и нажмите сюда Для быстрой цитаты из этого сообщения выделите текст и нажмите сюда
AllesKlar  
Дата
Цитировать сообщение

Пользователя сейчас нет на форуме



Здесь живет
******

Профиль
Группа: Форумчанин
Завсегдатай форума
Сообщений: 3375
Пользователь №: 38635
На форуме: 2 года, 11 месяцев, 6 дней
Карма: 170




matroskin777
эка ты намудрил.
Он сам автоматически закрывается, не мешай ему ;)

Вот исходники с примером, там все очень просто.
https://github.com/karlseguin/jquery.simpleDatePicker

<!DOCTYPE html>
<html>
<head>
<link
href="simpleDatePicker.css" media="screen" rel="stylesheet" type="text/css" />
<script
type="text/javascript" src="jquery.min.js"></script>
<script
type="text/javascript" src="jquery.simpleDatePicker.js"></script>
</head>
<body>

<input
type="text" id="date" />
<input
type="button" id="c" />

<script
type="text/javascript">
$(document).ready(function() {
$('#date').simpleDatePicker();
$('#c').click(function() {
$('#date').simpleDatePicker({command: 'toggle'})
return false;
})
});
</script>


и эта....
1.7.0/jquery.min.js ... на дворе уж давно 11-я версия.


--------------------
[продано копирайтерам]
PMПисьмо на e-mail пользователю
    0   Для быстрого поиска похожих сообщений выделите 1-2 слова в тексте и нажмите сюда Для быстрой цитаты из этого сообщения выделите текст и нажмите сюда
matroskin777  
 ۩  Дата
Цитировать сообщение

Пользователя сейчас нет на форуме



Новичок
*

Профиль
Группа: Пользователь
Сообщений: 9
Пользователь №: 42306
На форуме: 11 месяцев, 8 дней
Карма:




Цитата (sergeiss @ 24.12.2015 - 16:57)
Цитата (matroskin777 @ 24.12.2015 - 16:47)
Не получается сделать чтобы формы календарей скрывались если нажимаю на другие места на странице.

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

При выборе даты в календаре он хорошо закрывается. я хочу если человек передумал вводить дату и перешел к следующему полю чтобы календарь закрылся.
PMПисьмо на e-mail пользователю
    0   Для быстрого поиска похожих сообщений выделите 1-2 слова в тексте и нажмите сюда Для быстрой цитаты из этого сообщения выделите текст и нажмите сюда
AllesKlar  
Дата
Цитировать сообщение

Пользователя сейчас нет на форуме



Здесь живет
******

Профиль
Группа: Форумчанин
Завсегдатай форума
Сообщений: 3375
Пользователь №: 38635
На форуме: 2 года, 11 месяцев, 6 дней
Карма: 170




Цитата (matroskin777 @ 24.12.2015 - 15:24)
. я хочу если человек передумал вводить дату и перешел к следующему полю чтобы календарь закрылся.

Цитата (AllesKlar @ 24.12.2015 - 15:04)
Он сам автоматически закрывается, не мешай ему


--------------------
[продано копирайтерам]
PMПисьмо на e-mail пользователю
    0   Для быстрого поиска похожих сообщений выделите 1-2 слова в тексте и нажмите сюда Для быстрой цитаты из этого сообщения выделите текст и нажмите сюда
matroskin777  
 ۩  [x] Дата
Цитировать сообщение

Пользователя сейчас нет на форуме



Новичок
*

Профиль
Группа: Пользователь
Сообщений: 9
Пользователь №: 42306
На форуме: 11 месяцев, 8 дней
Карма:




Переделал взял за основу код AllesKlar спасибо.

Но теперь проблема встала что календарь всегда открывается под первым полем

user posted image

код meta

<!-- <link href="/simpleDatePicker.css" media="screen" rel="stylesheet" type="text/css" /> перемещены в стандартный css-->
<script type="text/javascript" src="/jquery.min.js"></script>
<script
type="text/javascript" src="/jquery.simpleDatePicker.js"></script>


html
<div class="otsorder">
Начать с:<input class="txtfldorder" type = "text" name = "s_data" value ="{bases_data}" id="date" />
<input
type="button" id="c" class = "minibutton" />
<script
type="text/javascript">
$(document).ready(function() {
$('#date').simpleDatePicker();
$('#c').click(function() {
$('#date').simpleDatePicker({command: 'toggle'})
return false;
})
});
</script>
  &nbsp  &nbsp  &nbsp Нужно доделать до:<input id="date2" class="txtfldorder" type = "text" name = "do_data" value ="{basedo_data}" />
<input
type="button" id="do" class = "minibutton" />

<script
type="text/javascript">
$(document).ready(function() {
$('#date2').simpleDatePicker();
$('#do').click(function() {
$('#date2').simpleDatePicker({command: 'toggle'})
return false;
})
});
</script>
</div>


Но нажимая на правое поле или кнопку календарь всегда появляентся под левым полем, подскажите как поправить?
PMПисьмо на e-mail пользователю
    0   Для быстрого поиска похожих сообщений выделите 1-2 слова в тексте и нажмите сюда Для быстрой цитаты из этого сообщения выделите текст и нажмите сюда
AllesKlar  
[x] Дата
Цитировать сообщение

Пользователя сейчас нет на форуме



Здесь живет
******

Профиль
Группа: Форумчанин
Завсегдатай форума
Сообщений: 3375
Пользователь №: 38635
На форуме: 2 года, 11 месяцев, 6 дней
Карма: 170




Оберни каждый в свой врапер и стилями.

Свернутый текст
<!DOCTYPE html>
<html>
<head>
<meta
charset="utf8">
<link
href="simpleDatePicker.css" media="screen" rel="stylesheet" type="text/css" />
<script
type="text/javascript" src="jquery.min.js"></script>
<script
type="text/javascript" src="jquery.simpleDatePicker.js"></script>

<style>

.datapicker_wrap {
float:left;
margin-left: 50px;
}
</style>

</head>

<body>
<div
class="otsorder">
<div
class="datapicker_wrap">
Начать с:<input class="txtfldorder" type = "text" name = "s_data" value ="{bases_data}" id="date" />
<input
type="button" id="c" class = "minibutton" />
</div>
<div
class="datapicker_wrap">
Нужно доделать до:<input id="date2" class="txtfldorder" type = "text" name = "do_data" value ="{basedo_data}" />
<input
type="button" id="do" class = "minibutton" />
</div>
</div>

<script
type="text/javascript">
$(document).ready(function() {
$('#date').simpleDatePicker();
$('#c').click(function() {
$('#date').simpleDatePicker({command: 'toggle'})
return false;
})
$('#date2').simpleDatePicker();
$('#do').click(function() {
$('#date2').simpleDatePicker({command: 'toggle'})
return false;
})

});
</script>

</body>


--------------------
[продано копирайтерам]
PMПисьмо на e-mail пользователю
    0   Для быстрого поиска похожих сообщений выделите 1-2 слова в тексте и нажмите сюда Для быстрой цитаты из этого сообщения выделите текст и нажмите сюда
matroskin777  
 ۩  Дата
Цитировать сообщение

Пользователя сейчас нет на форуме



Новичок
*

Профиль
Группа: Пользователь
Сообщений: 9
Пользователь №: 42306
На форуме: 11 месяцев, 8 дней
Карма:




Спасибо AllesKlar!
PMПисьмо на e-mail пользователю
    0   Для быстрого поиска похожих сообщений выделите 1-2 слова в тексте и нажмите сюда Для быстрой цитаты из этого сообщения выделите текст и нажмите сюда
  Быстрый ответ
Информация о Госте
Введите Ваше имя
Кнопки кодов
Для вставки цитаты, выделите нужный текст и
НАЖМИТЕ СЮДА
Введите сообщение
Смайлики
:huh:  :o  ;) 
:P  :D  :lol: 
B)  :rolleyes:  <_< 
:)  :angry:  :( 
:unsure:  :blink:  :ph34r: 
     
Показать всё

Опции сообщения  Включить смайлики?
 Включить подпись?
 
1 Пользователей читают эту тему (1 Гостей и 0 Скрытых Пользователей)
0 Пользователей:

Опции темы Ответ в темуСоздание новой темыСоздание опроса