2012-02-16 22 views
3

私はjoomlaのカレンダーを使用して日付を選択しています。以下は、そのhtmlコードを示しています。ここで画像をクリックすると、カレンダーがポップアップしてそこに日付を選択するとポップアップが閉じ、日付の値が入力テキストフィールドに表示されます。私が欲しいのは、日付が変更された場合、ajax投稿を行う関数を書いておきたいです(入力テキストの変更)。私は単純な警告()を試みたが、うまくいきませんでした。テキストフィールドのフォーカスが失われていると思うのは、クリックした画像と入力フィールドとの接触がマウスやキーのいずれかで押されただけなのだからです。 PLZはこれを解決するのに役立ちます。入力フィールドでテキストの変更をキャッチ

$("#select_date").change(function(){ 
    alert('Working'); 
}); 

HTMLコード

<input id="select_date" type="text" value="2012-02-16" name="select_date" title="Thursday, 16 February 2012"> 
<img id="select_date_img" class="calendar" alt="Calendar" src="/eap_movies/media/system/images/calendar.png"> 

PHPコード

JHTML::_('behavior.calendar'); 
JHTML::calendar(date('Y-m-d'),'select_date', 'select_date', '%Y-%m-%d'); 
+2

カレンダーコントロールには、日付を選択したときに使用できるコールバックがありますか? –

答えて

2

Mihai Bazon's DHTML Calendar v1.0onSelectedonCloseイベントのコールバックを有します。したがって、カレンダーの終了時またはユーザーが日付を選択したときにキャッチすることが可能でなければなりません。

ソリューション1 - 編集Joomlaの

ステップ1 - あなたはこのファイルを上書きする必要があります:libraries/joomla/html/html.php

// added $onSelected parameter 
public static function calendar($value, $name, $id, $format = '%Y-%m-%d', $attribs = null, $onSelected) 
{ 
    ... 
$document->addScriptDeclaration('window.addEvent(\'domready\', function() {Calendar.setup({ 
      inputField: "'.$id.'",   // id of the input field 
      ifFormat: "'.$format.'",  // format of the input field 
      button: "'.$id.'_img",   // trigger for the calendar (button ID) 
      align: "Tl",       // alignment (defaults to "Bl") 
      singleClick: true, 
      onSelected: '.$onSelected.' 
});});'); 
... 
} 

ステップ2 - onSelected

JHTML::_('behavior.calendar'); 
JHTML::calendar(date('Y-m-d'),'select_date', 'select_date', '%Y-%m-%d', null, 'userSelectedDate'); 

ステップ3のコールバックを定義します - コールバックの実装

function userSelectedDate(calendar, date){ ... } 

メモ:私はJoomlaをアクティブにインストールしていないため、上記のコードで構文エラーが発生する可能性があります。

ソリューション2 - サラの容易なソリューション

JHTML::calendar$attribsパラメータにonchange定義を追加します。同様

JHTML::calendar(date('Y-m-d'),'select_date', 'select_date', '%Y-%m-%d','onchange="myfunction();"');

が訪問DHTML Calendar Website

+3

良いアイデア!!! http://docs.joomla.org/API16:JHtml/calendarが表示されなかったので、html属性を渡しました。 JHTML :: calendar(date( 'Ym-d')、 'select_date'、 'select_date'、 '%Y-%m-%d'、 'onchange = "myfunction();"'); ' 。 – Sara

+2

これは間違いなく簡単です:) – papaiatis

2

Changeイベントがトリガされます場合にのみ、入力緩いフォーカス(ぼかし)。

可能であれば、キー押下、キーアップまたはキーダウンイベントを監視したり、日付が選択されたときにイベントをトリガすることができます。

1

どのバージョンのjqueryを使用しますか? 私は同じ問題を抱えていたし、実際にフィールドでのユーザー操作がないので、keyUpイベントイベントでの作業は、あなたのケースでは動作しませんので、私は

$('elementName').on("input propertychange",function() { 
alert("detected"); 
}); 

と一緒に行きました。

(/media/system/js/calendar.js下)
+0

jQuery ver。1.7 – Sara

関連する問題