1

この例のように、Jquery datepicker を JSF ページに実装したいと考えています。これまでのところ、次のコードを使用してカレンダーを JSF 入力フィールドに呼び出すことができました。

//For calendar
function calendar(){                                
    // Datepicker
    $('#datepicker').datepicker({
        inline: true,
        showWeek: true,
        firstDay: 1
    });
}

この入力フィールドを使用してコードを呼び出します。

<h:panelGroup>
        <div id="datepicker"></div>
        <h:inputText  onfocus="calendar()" value="#{DatabaseController.formMap['userid']}" >                                       
    </h:inputText>
</h:panelGroup>

入力欄をクリックするとカレンダーが表示されます。

ここに画像の説明を入力

この例を JQuery Web サイトに実装したいのですが、私の場合、入力フィールドの外側をクリックすると、予定どおりにカレンダーが非表示になりません。どうすればこれを修正できますか?

ピーターのベストウィッシュ

4

3 に答える 3

2

idの代わりにクラス名を使用できます。このJSと終わりを前に置きます</h:body>

<script type="text/javascript">
    //For calendar
    $(".datepicker").datepicker({
        inline: true,
        showWeek: true,
        firstDay: 1
    });

</script>

そして、これはカレンダーの入力フィールドです。

<h:inputText styleClass="datepicker" value="#{DatabaseController.formMap['userid']}" >   </h:inputText>
于 2012-05-16T18:18:03.213 に答える
1

$( "#datepicker" ).datepicker("hide");要素がフォーカスを失ったときに行を実行するイベント関数を作成する必要があります。次のような方法でこれを行うことができます。

$("#dateInputElementIdGoesHere").blur(function() {
  $( "#datepicker" ).datepicker("hide");
});
于 2012-05-16T15:35:01.270 に答える