0

私はjQueryでfullcalenderを使用していますが、それが可能かどうか疑問に思っています.配列があれば、'bold' = true/false,jqueryを使用して新しいクラスをアタッチできます.

$(document).ready(function() {
    $('#calendar').fullCalendar({
        editable: false,
        allDay: false,
        events: "json-events.php",
        eventDrop: function(event, delta) {
            alert(event.title + ' was moved ' + delta + ' days\n' +
                '(You cannot update these fields!)');
        },
        loading: function(bool) {
            if (bool) $('#loading').show();
            else $('#loading').hide();
        },
    });
});

データベース値 ID が「太字」の場合、jquery に「タイトル」のスタイルを追加できますか。

$result = $dbh->query($sql)->fetchAll(PDO::FETCH_ASSOC);

foreach ($result as $row){
$return[]=array('id'=>$row['id'],
                'title'=>$row['title'],
                'start'=>$row['start'].' '.$row['time'],
                'end'=>$row['end'],
                'url'=>$row['url'],
                'backgroundColor'=>$row['backgroundColor'],
                'textColor'=>$row['textColor'],
                'borderColor'=>$row['borderColor'],
                'description'=>$row['description'],
                "allDay" => false);
}
$dbh = null;

header('Content-type: application/json');
echo json_encode($return);

jQueryを使用するか、phpscriptを編集したいと思います。しかし、fullcalender.js ファイルを編集したくありません。

編集

私はこれについてもっと調べていて、events: "json-events.php" の場合、css に太字のスタイルを追加する関数を追加できます。

 $(document).ready(function() {
    $('#calendar').fullCalendar({
        editable: false,
        allDay: false,
        events: function() {...

おそらく getElementById の変数を追加し、それが true の場合は、スタイルを CSS に追加します。

4

1 に答える 1

1

必要なものかどうかは正確にはわかりませんが、このコードを使用して、日付の上にマウスを置いたときに、jquery カレンダーのいくつかの要素にクラスを追加しました。マウスオーバーした日付に要素が含まれている場合、ツール ヒントが開き、その特定の要素に関する詳細が表示されます。

/// <reference path="jquery-1.7.1-vsdoc.js" />


$(document).ready(function () {
    $.getJSON("getProductJSON.json", null,
        function (data) {
            $('#calendar').fullCalendar({
                editable: false,
                theme: true,
                header: {
                    left: 'prev,next today',
                    center: 'title'
                },
                events: data,
                eventMouseover: function (calEvent, jsEvent) {
                    xOffset = 1;
                    yOffset = 8;



                $("body").append(GetEventDetails(calEvent));
                $("#tooltip")
                        .css("top", (jsEvent.clientY + yOffset) + "px")
                        .css("left", (jsEvent.clientX - xOffset) + "px")
                        .fadeIn("fast");
            },
            eventMouseout: function (calEvent, jsEvent) {
                $("#tooltip").remove();
            },
            eventClick: function (calEvent, jsEvent) {

                w = window.open('', 'More details Event: ', 'width=300,height=200')
                w.document.write(GetEventDetails(calEvent));
                w.focus();
                return false;
            }
        });
    }
);
});

function GetEventDetails(e) {
    var output = "<p id='tooltip'>";
    output += "<label class='tt'> Heure :</label>" + e.heure + "<br />";
    output += "<label class='tt'> Durée :</label>" + e.duree + "<br />";
    output += "<label class='tt'> Description :</label><br />" + e.desc + "</p>";
    return output;

}

JSON data :
[
 {  "title":"souper pizza", "desc":"5 a 7 pizza, initiation", "start":"2012/02/29","heure":"17:00:00","duree":"120",
    "url": "#"
 },
 {  "title":"cours","desc":"cours6gei470","start":"2012/02/12","heure":"16:00:00","duree":"180",
    "url": "#"},
 {  "title":"Cool","desc":"Cool Yo","start":"2012/02/1","end":"2012/02/4","heure":"16:00:00","duree":"999",
    "url": "#"}
]
于 2012-04-18T02:39:11.970 に答える