2

私は20のオプションを選択しており、ユーザーが特定のオプション「日付時刻を選択」を1つだけ選択すると、日付（時刻）ピッカーが表示され、入力ボックスに日付時刻テキストが入力されます。

それは可能ですか？どうやってやるの？

現在、日付（ピッカー）が機能しています。ボタンによってトリガーされ、入力ボックスにリンクされます。しかし、特定のニーズに合わせて現在の動作を変更したいと考えています。

質問 1: select の変更時に関数を起動する方法を知っています。次に、オプションをフィルタリングし、それがオプションである場合は、どういうわけか日付ピッカーを開始します。この部分のやり方がわかりません。

質問 2:日付ピッカーに日付テキストを既存のテキスト ボックスに追加するよう指示する方法がわかりません。日付タイマー ピッカーとテキスト ボックスを何らかの方法でリンクできるかもしれません。

  • jquery-1.7.2.min.js
  • jquery-ui-1.8.21.custom.min.js
  • jquery-ui-timepicker-addon.js

アップデート

jsfiddle サンプルでは、​​選択ボックスとテキスト ボックスがあります。ボタンは日付/時刻ピッカーによって作成されます。

私が欲しいのは：

  • ユーザーが「日付と時刻の選択」オプションを選択/クリックすると、日付/時刻ピッカーが表示され、テキストがテキスト ボックスに表示されます。
  • ボタンをページに表示したくない
  • 日付/時刻だけでなく他の目的にもテキスト ボックスを使用しているため、このテキスト ボックスに関連するユーザー アクションによって日付/時刻ピッカーが表示されません。

サンプルの html コード

<input id="datetime" type="text" name="datetime" value="" >
<select size=5>
    <option value="not">Not this one</option>
    <option value="not">Not this one</option>
    <option value="not">Not this one</option>
    <option value="datetimepicker">Select date and time</option>
</select>

サンプルの JavaScript コード

$('#datetime').datetimepicker({
    showOn: "button"
});​

注: 上記の最終作業バージョン: http://jsfiddle.net/radek/dPRjS/8/

4

2 に答える 2

1

これを試して：

$('#datetime').datetimepicker();
$('option[value=datetimepicker]').click(function() {
    $('#datetime').datetimepicker('show');
});​

あなたの中心的な質問に答えるために、datetimepicker プラグインは datepicker jQueryUI ウィジェットの拡張であり、show メソッドを含むすべてのメソッドにアクセスできます。そのため、必要なときにいつでもプログラムでショーを呼び出してピッカーを開くことができます。

jsFiddle の例。

于 2012-06-15T03:40:36.137 に答える
1

あなたの質問に逆の順序で答える....

Datepicker は通常、入力ボックスに「接続」されています。選択した日付を入力ボックスに入れるように datepicker に指示する必要はありません。日付ピッカーは、ユーザーが日付を選択したときに閉じるときにそうします。

これにより、外部イベントに基づいて日付ピッカーを開く方法のトリックが残ります。通常、添付の入力ボックスをクリックすると、日付ピッカーが自動的に開きます。選択/ドロップダウンの変更で自動的に開くようにしたい。

これは私のために働いた：

js:

$(document).ready(function() {
  var $dp = $('#date1').datepicker({});

  $('#select1').change(function() {
      // programmatically open the datepicker
      $dp.datepicker('show'); 
  });
});

html:

<input type="text" id="date1" size="12">
<br/>
<select id="select1">
  <option>Hello</option>
  <option>Bonjour</option>
  <option>Buon giorno</option>
  <option>Guten tag</option>
</select>
于 2012-06-15T03:41:23.107 に答える