人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

JQuery Datepickerを使って 例えば、テキストボックスを用意して、2011/06/10を片方に入れて、
もう片方に2011/10/10を入れて、2011/06/10?2011/10/10というのをやりたいのですが
色々調べたのですがうまくいく方法が見つかりません。
どのサイトのがやりやすいのか教えて欲しいです

●質問者: たつ
●カテゴリ:コンピュータ インターネット
○ 状態 :終了
└ 回答数 : 2/2件

▽最新の回答へ

1 ● a-kuma3

http://jqueryui.com/demos/datepicker/#date-range

ほぼ、そのまんまですが。

<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/themes/base/jquery-ui.css" type="text/css" media="all" />
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js" type="text/javascript"></script>

<!-- ★日本語化 -->
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1/i18n/jquery.ui.datepicker-ja.min.js"></script>


<script>
$(function() {
 var dates = $( "#from, #to" ).datepicker({
 defaultDate: "+1w",
 changeMonth: true,
 numberOfMonths: 1, /* ★一ヶ月分 */
 onSelect: function( selectedDate ) {
 var option = this.id == "from" ? "minDate" : "maxDate",
 instance = $( this ).data( "datepicker" ),
 date = $.datepicker.parseDate(
 instance.settings.dateFormat ||
 $.datepicker._defaults.dateFormat,
 selectedDate, instance.settings );
 dates.not( this ).datepicker( "option", option, date );
 }
 });
});
</script>

<div class="demo">
<label for="from">From</label>
<input type="text" id="from" name="from"/>
<label for="to">to</label>
<input type="text" id="to" name="to"/>
</div><!-- End demo -->

↓は、jsFiddle で確認したやつです。

http://jsfiddle.net/EaPAC/

◎質問者からの返答

divをテーブルに変えたいのですが可能ですか?


2 ● a-kuma3
ベストアンサー

divをテーブルに変えたいのですが可能ですか?

もちろん。

datepicker は、input type=text に振られている ID 属性だけを見て動いてるので。

table を使ったのを↓。

http://jsfiddle.net/EaPAC/1/

関連質問

●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ