web-dev-qa-db-ja.com

イベントのID（フルカレンダー）

FullcalendarのすべてのイベントにIDを追加する必要があります。これを見つけました http://arshaw.com/fullcalendar/docs/event_data/Event_Object/ 方法がわかりませんが、このIDは
すべてのイベントに固有です。これは、イベントをMysqlデータベースに保存するためです。ありがとう

javascriptmysqlfullcalendar
11
Bryan Villafañe

私は解決策を見つけました！イベントを作成するときは、ここに一意のIDを入力してください。

var shift = calendar.fullCalendar('renderEvent',
        {
            id: shift_id,
            title: current_name,
            start: new Date(y, m, d + current_day, current_start_time_h, current_start_time_m),
            end: new Date(y, m, d + current_day, current_end_time_h, current_end_time_m),
            allDay: false
        }, true // make the event "stick"
        );

その後、このリスナーはDOM構造にIDを追加します。

     eventAfterRender:function( event, element, view ) { 
$(element).attr("id","event_id_"+event._id);
},

フィールドですべてのイベントを取得するには：

console.log(calendar.fullCalendar('clientEvents'));

これでイベントの配列ができ、すべてのイベントにDOM構造で番号が付けられました。

7
Aleksandr Skobeltcyn

Fletchが言及しているように、同時実行を可能にするために、DB内またはDB接続コードを使用して新しいイベントごとにIDを生成する必要があります。 BryanVillafañeも同様のアプローチを使用していますが、これが私の解決策です。

FC javascriptの場合：

select: function(start) { //executed when clicked on a day
    var title = Prompt('Event title:');
    if (title) {
        $.ajax({
            url: '/events.php',
            data: 'title='+title+'&start='+moment(start).format('YYYY-MM-DD'),
            type: "POST",
            success: function(id) { 
                console.log(id); //used for debug
                if (!isNaN(id)){ //on success checks the result 
                    event = {    //and adds the event locally with the returned DB id.
                        title: title,
                        start: start,
                        team: team,
                        id: id
                    }//then renders the new event
                    $('#calendar').fullCalendar('renderEvent', event, true);
                }
            },
            error: function(error){
                console.log(error);
            }
        });
    } //unselects the clicked day
    $('#calendar').fullCalendar('unselect');
}

AllDayイベントのみを使用するため、これにより日付がYYYY-MM-DD形式で送信されますが、適切に更新できます。 startだけを送信すると、ミリ秒単位のエポック時間が発生します。

挿入が成功した場合、DBは行のIDを返します。これは、ローカルで作成されたイベントに割り当てられ、レンダリングされます。 DB関数は次のとおりです。

$result = "Wrong parameter combination!";
if ($_POST[title]&&$_POST[start]) {
    $result = $db->exec("INSERT INTO events (title, start) VALUES ('$_POST[title]','$_POST[start]')");
    if($result==1){
        $result = $db->lastInsertRowID();
    }
}
echo $result;

ここでは、2つのPOSTパラメーターをチェックして挿入を実行します。挿入が成功した場合は、最後の挿入行IDを取得してJSに返します。それ以外の場合はエラーメッセージが返されます。

DBにSQLite3を使用していますが、MySQLに最後に挿入された行は次のように確認できます ここ 。挿入と最後の行のIDチェックの間に誰かが別のイベントを挿入する可能性はわずかですが、トラフィックが多い場合を除いて、問題はありません。

2
Stoinov

各イベントにはすでに固有のIDがあります。

eventClick: function(event){
    alert(event._id);
}
1
Stnfordly

EventオブジェクトのIDはオプションのフィールドです。サーバーサイドスクリプトから返したいものは何でも、戻って使用できます。フィールドの組み合わせから複合IDを作成できます... 'calendarName_eventID'または、データベースのeventIDを使用するだけです。ただし、そのように主キーを公開するかどうかはわかりません（それ自体が別の問題です）。簡単に言えば...独自のID値を作成することができます。

こちらをご覧ください： https://code.google.com/p/fullcalendar/issues/detail?id=71

スレッドはカレンダーイベントの削除を扱いますが、元の投稿者が保存イベントからのコールバックでIDをどのように設定していたかを示しています。

お役に立てば幸いです。

1
fletch

OK、これが私の解決方法です。最初にDBから最後のIDイベントを取得し、最後のIDに1を加えます

<?php
$sql = mysql_query("SELECT id FROM calendar ORDER BY id DESC LIMIT 1");

$resul = mysql_fetch_row($sql);
$idActual = $resul[0];
$idActual = $idActual + 1;
?>

次に、IDをJSに送信します

var idActual = "<?php echo $idActual ?>";

以上です。

1
Bryan Villafañe

明確な解決策は

Ajaxでイベントをフェッチするときは、DBからの「id」も割り当てます

id：entry.id

$.ajax({ 
    url: '/eventsJson', 
    type: 'GET', 
    data: { }, 
    error: function() {
        alert('there was an error while fetching events!');
    } 
}).done(function (doc) { 

    var event = Array();
    $.each(doc, function(i, entry) {
        event.Push({id:entry.id, title: entry.title, start: entry.start});
    });

イベントクリック

eventClick: function(event, jsEvent, view) {
               var title = Prompt('Event Title:', event.title, { buttons: { Ok: true, Cancel: false} });

           if (title){
           event.title = title;

           var data = {
                'title':title
            };

           $.ajax({
             url: '/events/'+event.id,
             data: data,
             type: 'POST',
             dataType: 'json',
             success: function(response){
               if(response.status == 'success')
               $('#calendar').fullCalendar('updateEvent',event);
             },
             error: function(e){
               alert('Error processing your request: '+e.responseText);
             }
           });
           }
        }
1
ErcanE

これと同様のパラメータでパラメータIDを設定することをお勧めします。

$('#calendar').fullCalendar({
  id: 'calendar',
  eventReceive: function(event) {
    alert(this.calendar.options.id);
  },
  eventDrop: function(event) {
    alert(this.calendar.options.id);
  },
  eventClick: function(event) {
    alert(this.calendar.options.id);
  },
  eventRender: function(event) {
    alert(this.calendar.options.id);
  }
});
0
GustavoLima