2016-11-07 22 views
1

FullCalendarとjQuery UIを使用して、バックグラウンドイベントとしてカレンダーに「Days Off」をドラッグしています。FullCalendar IDで外部イベントを削除

FullCalendarでバックグラウンドイベントをクリックすることはできないので、私は自分の休みのあるリストを作成しています。その横に「削除」ボタンがあり、イベントIDをデータ属性として使用しています。

ただし、[削除]ボタンをクリックすると、適切なIDを持っていてもイベントは削除されません。イベントIDが正しく更新されたことを示すのためにhttps://jsfiddle.net/aaroncadrian/odhL964L/

あなたが明らかにしたイベントをクリックすることができるように、私はイベントのバックグラウンドレンダリングを削除:

このjsFiddleをご覧くださいそのID。また、ボタンとそのdata-id属性でイベントIDを表示することもできます。イベントを削除するコードは次のとおりですが、これは機能しません。

$('.remove').click(function(){ 

    // Get the ID for the event from the button 
    var id = $(this).data('id'); 

    // Remove the event. **DOES NOT WORK** 
    $('#calendar').fullCalendar('removeEvents', id); 

}); 

あなたは私が私がそれに対応するボタンをクリックしてイベントを削除する方法を教えてくださいことはできますか?再び、理想的には、バックグラウンドイベントとしてレンダリングされているこれらのイベントが必要です。

UPDATE

私は負荷でページにイベントとそれに対応するボタンを追加し、イベントは、ページの読み込みにレンダリングしてからイベントを削除する機能が動作します。カレンダーにドロップされた外部イベントが同じ方法でリムーバブルになるように、私は別に何をする必要がありますか?

答えて

1

https://jsfiddle.net/oLe2Lgxs/

にご

var button = '<button class="remove" data-id="' + event.id +'">Remove (' + event.id + ')</button>'; // Create remove button with data-id attribute with event ID 

var button = '<button class="remove" data-id="' + event._id +'">Remove (' + event.id + ')</button>'; // Create remove button with data-id attribute with event ID 

$('.remove').click(function(){ 

に変更します

$('#daysOff').on('click', 'button.remove', function(){ 

カレンダーから項目を削除するには、なぜ内部イベントに割り当てられたID 1が働いていなかった _id作品を使用して

わかりません。

li日付/ボタンの入力を$(this).parent()。remove();で削除することもできます。クリックハンドラー内の

+0

ありがとうございました!これは完璧です!なぜ私のIDがうまくいかないのかわからないけど、_idの動作が分かってうれしいです! – Aaron

関連する問題