1

継ぎ目付きのRichfaces3.3を使用しています。コンポーネントが<rich:calendar>あり、その中の複数の日付を強調表示する必要があります。その日付を実行時に動的に設定する必要があります。<rich:calendar>これはコンポーネントで可能ですか?ありがとう。

4

1 に答える 1

2

複数の日付を選択することはできません(<rich:calendar/>日付フィールドの入力として機能します)が、他の日とは異なる方法で一部の日を色付けすることはできます。これらはあなたのオプションです:

  1. 強調表示する日付を除くすべての日付を無効(グレー表示)にします。これにより、ユーザーは有効になっていない日付を選択できなくなります。true「day」パラメータを取り、日付を有効にするかfalseどうかを返すjavascript関数を実装する必要があります。次に、のisDayEnabled属性で関数を指定します<rich:calendar/>(たとえば<rich:calendar isDayEnabled="dayEnabledFunction" />)。

  2. 必要な日付にさまざまなクラスを適用します。これにより、ユーザーは任意の日付を選択できますが、それでも必要な日付が強調表示されます。cssクラスを作成し、そのクラスを必要な日付にのみ適用します。ここでも、「day」パラメーターを取り、適用するクラスの名前を含む文字列を返すjavascript関数を実装します。強調表示したくない日付には空の文字列を返し、強調表示したい日付には新しいcssクラス名を返します。次に、のdayStyleClass属性で関数を指定します<rich:calendar/>(たとえば<rich:calendar dayStyleClass="dayStyleFunction" />)。

日付をjavascript関数に渡すには、サーバー側で適切なJavaScriptコードを生成する必要があります。次に例を示します。

<script type="text/javascript">
    highlightDates = new Array();
    #{myComponent.dateList}
</script>

MyComponentコード:

@Named("myComponent")
public class MyComponent implements Serializable {

    // The list of dates to highlight, taken from somewhere
    private List<Date> dates;

    public String getDateList() {
        StringBuilder sb = new StringBuilder();
        // Iterate the list of dates and add a javascript push
        // for each date and return the resulting string.
        for (Date d : dates) {
            sb.append("highlightDates.push(new Date(");
            sb.append(d.getTime());
            sb.append(");\n");
        }
        return sb.toString();
    }
}

javascript関数がどのように機能するかの例を次に示しdayStyleClass="dayFunc"ます。これは、jQuery(richfacesが必要)があり、noconflict()関数を使用していることを前提としています。配列内の値のインデックスを返すjQuery.inArray関数を使用します。値が配列内にない場合は、-1を返します。

function dayFunc(day) { 
    return jQuery.inArray(day, highlightDates) >= 0 ? 'highlighted' : 'normal'; 
}
于 2012-10-05T11:08:40.750 に答える