EasyWeb.org.ua
  • Главная
    • shop-script
    • акции
    • php
    • javascript
    • joomla
    • wordpress
    • docs
    • internet
    • объявления
    • other
  • Вопрос ответ
  • Портфолио
  • Модули
  • Обратная связь
  • О блоге
    • Каталог сайтов
    • Карта сайта
Главная » javascript » календарь javascript, jquery
мая16 10

календарь javascript, jquery

Опубликовано в javascript


Какое-то время назад я уже рассказывал про ввод даты на javascript

Теперь хочу рассказать о замечательном плагине jquery — Datepicker

Плаги прост в использовании и имеет множество свойств и возможностей.

Все, что необходимо есть на оф. странице — http://jqueryui.com/demos/datepicker/

Там же можно выбрать внешний вид вашего календаря и скачать полный пакет (картинки, стили, скрипты, примеры страниц)

Вообщем, и рассказывать нечего — все есть там.

Ниже приведу пример с установкой «нашего» формата и отображения нормальной рабочей недели (где первый день — понедельник). Все остальное по аналогии сможете выбрать сами из списка параметров

Набор опций и параметров — http://jqueryui.com/demos/datepicker/
Код примера:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/jquery-ui.min.js" type="text/javascript"></script>
<link rel="stylesheet" href="/ex/ui.css" />

<script type="text/javascript">
 			$(function() { $("#datepicker").datepicker({ dateFormat: 'yy-mm-dd', monthNames: ['Январь','Февраль','Март','Апрель','Май','Июнь','Июль','Август','Сентябрь','Октябрь','Ноябрь','Декабрь'],firstDay:1,dayNamesMin: ['вс','пн', 'вт', 'ср', 'чт', 'пт', 'суб']}); });
</script>
<div class="demo">
Дата: <input id="datepicker" type="text" />

</div>
Метки: date, DatePicker, javascript, jquery

« Предыдущая запись

скоро новый год :)



Просмотров: 3 129

Похожие записи:

  • ввод даты, календарь javascript
  • Слайдер в списках продуктов
  • скоро новый год :)

10 Коммент.

  1. MASSE4KA | 27 июня 2010 at 20:51

    Опишите пожалуйста подробнее как вставить подобный вид календаря к себе на сайт. А главное как сделать его не выплывающим. Я не могу разобраться с данным вопросом на оф сайте.

    Ответить
  2. Артем | 28 июня 2010 at 21:49

    как вставить — в статье работающий пример. этого достаточно, чтобы скрипт заработал

    попробуйте прочитать пункт http://jqueryui.com/demos/datepicker/#inline

    	  	<script type="text/javascript">  	$(function() {  		$("#datepicker").datepicker();  	});  	</script>
           <div class="demo">    Date: <div id="datepicker"></div>
     </div><!-- End demo -->
     <div class="demo-description">
     <p>Display the datepicker embedded in the page instead of in an overlay.  S
    imply call .datepicker() on a div instead of an input.</p>    </div>
    <!-- End demo-description -->
    Ответить
  3. Настя | 29 июня 2010 at 17:28

    У меня стили не работают( Появляеться только голый скелет(

    Ответить
  4. Артем | 29 июня 2010 at 17:53

    там еще есть папка с картинками
    ее тоже нужно загрузить на сервер. а в файле css правильно указать пути к этим картинкам

    Ответить
  5. Настя | 29 июня 2010 at 18:01

    при таком вводе:

    $(function() { $(«#datepicker»).datepicker(); });
    Date:

    Display the datepicker embedded in the page instead of in an overlay.
    Simply call .datepicker() on a div instead of an input.

    У меня выводяться на экран только слова Дата:, и та строчка, которая в теге

    Ответить
  6. Настя | 29 июня 2010 at 18:04

    при таком вводе
    link type=»text/css» href=»css/themename/jquery-ui-1.8.custom.css» rel=»Stylesheet» /
    script type=»text/javascript» src=»js/jquery-1.4.2.min.js» /script
    <script type="text/javascript" src="js/jquery-ui-1.8.custom.min.js" /script

    /head

    body

    script type="text/javascript" $(function() { $("#datepicker").datepicker(); }); /script
    div class="demo" Date: div id="datepicker" /div /div

    div class="demo-description"
    p Display the datepicker embedded in the page instead of in an overlay.
    Simply call .datepicker() on a div instead of an input./p
    /div

    /body

    /html

    У меня отображается только слово Дата и та строчка которыя в теге р

    Ответить
  7. Настя | 29 июня 2010 at 18:06

    «Display the datepicker embedded in the page instead of in an overlay.
    Simply call .datepicker() on a div instead of an input.»
    ——Как это сделать??

    Ответить
  8. Настя | 29 июня 2010 at 18:44

    ПОЛУЧИЛОСЬ!!!

    Ответить
    • Артем | 29 июня 2010 at 19:04

      я вас поздравляю! заходите еще

      Ответить
  9. guest | 15 декабря 2010 at 18:26

    (ссылка)

    Ответить

Оставить комментарий Отменить ответ

Ваш e-mail не будет опубликован. Обязательные поля помечены *

*

*

Можно использовать следующие HTML-теги и атрибуты: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre lang="" line="" escaped="" highlight="">

  • Twitter
  • Facebook
  • Google
  • RSS

| |

Последние комментарии

  • Артем к записи Оплата через LiqPay для Shop-Script
  • Владимир к записи Оплата через LiqPay для Shop-Script
  • The Best к записи Убираем auxpage_ у дополнительныйх страниц
  • Андрей к записи Прием платежей по пластиковым картам в Украине
  • Ирина к записи Партнерская программа. Дорабатываем Webasyst Shop-Script

Самые комментируемые

  • Автоматическое заполнение рекомендуемых товаров (129)
  • дерево категорий по-своему (shop-script) (127)
  • Фильтры в Webasyst Shop-Script (61)
  • WP Cumulus для Shop-Script исправленный (58)
  • Оплата через LiqPay для Shop-Script (51)
  • WP Cumulus для Joomla и Shop-Script (46)
  • Две цены в WA Shop-Script (46)

Самые читаемые

  • Фильтры в Webasyst Shop-Script - 10 572 просмотров
  • дерево категорий по-своему (shop-script) - 9 317 просмотров
  • ввод даты, календарь javascript - 8 845 просмотров
  • Бренды в Webasyst Shop-Script - 6 331 просмотров
  • Автоматическое заполнение рекомендуемых товаров - 5 758 просмотров
  • «хочу в подарок» ВКонтакте для Shop-Script - 4 619 просмотров
  • Слайдер в списках продуктов - 4 179 просмотров

Архивы







Поддерживать ежемесячно с помощью Donutor

Свежие записи

  • Новый Год отменяется :(
  • Webasyst Shop-Script новгодняя распродажа
  • новый шаблон
  • BUBA 2011
  • Zend Framework Day 2011

друзья

  • at-home
  • Fisher — сотовые телефоны
  • WebAsyst
  • WebComplIT
  • Zdorovy.in.ua

Счетчики

www.megastock.ru Яндекс.Метрика

Мета

  • Войти
  • RSS записей
  • RSS комментариев
  • WordPress.org

© 2008-2012 EasyWeb.org.ua | Дизайн elegantthemes.com | Разработано на CMS WordPress

столовый серебряный набор microsoft dynamics телефоны Львов