

fullcalendarのv3.9.0を使用しています。

**動き**  
・左の予定リストからイベントを追加し、日付へドラッグアンドドロップができます。  
・日付へ入れた予定をダブルクリックすると予定を消せるようになる

**困っていること**  
・ダブルクリックをすると予定を削除できるのですが、消えた後にほかの予定をドラッグアンドドロップすると消えたはずの予定が復活してしまいます。  
例：1月7日の予定を削除する→別の日付へイベントを入れる→入れたイベントと同時に消したはずの1月7日のイベントが出てくる。

**追記**  
削除のコードを下記に変えてみたのですが、今度は新たに予定を追加しても消えたままになったのですが、  
削除をすると選択していないほかの予定もすべて消えてしまいました…

[![画像の説明をここに入力](https://i.stack.imgur.com/Y6r8T.png)](https://i.stack.imgur.com/Y6r8T.png)

**追記分コード↓**  

[code]

    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    //ダブルクリックで予定削除（未完成）
        eventRender: function(event, element) {
            (element).bind('dblclick', function() {
          if(!confirm('本当に削除しますか？')){
           return false;
          }else{
                $('#calendar').fullCalendar("removeEvents", event.id);
          }
            });
        },
[/code]

**元コード**

[code]

    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    
    $(document).ready(function () {
    
        // 外部イベントを初期化します
        // -----------------------------------------------------------------
        $('#external-events .fc-event').each(function() {
            // カレンダーがドロップ時にイベントをレンダリングできるようにデータを保存します
            $(this).data('event', {
                title: $.trim($(this).text()), // イベントタイトルとして要素のテキストを使用
                stick: true //ユーザがナビゲートする時に維持する(renderEventメソッドのドキュメントを参照)
            });
    
            // jQuery UIを使用してイベントをドラッグ可能にします
            $(this).draggable({
                zIndex: 999,
                revert: true,      // イベントをもとの状態に戻します
                revertDuration: 0  // ドラッグ後の元の位置
            });
        });
    
        // カレンダーの設定
        $('#calendar').fullCalendar({
            header: {
                left: 'prev,next today',
                center: 'title',
                right: 'month,agendaWeek,agendaDay'
            },
    
            //ダブルクリックで予定削除（未完成）
            eventRender: function(event, element) {
                (element).bind('dblclick', function() {
                    if(!confirm('本当に削除しますか？')){
                        return false;
                    }else{
                        $(this).remove();
                    }
                });
            },
    
            height: 550,
                firstDay: 1,
            lang: "ja",
            selectable: true,
            selectHelper: true,
            select: function(start, end) {
                var title = prompt("予定タイトル:");
                var eventData;
                if (title) {
                    eventData = {
                        title: title,
                        start: start,
                        end: end
                    };
                    $('#calendar').fullCalendar('renderEvent', eventData, true); // stick? = true
                }
                $('#calendar').fullCalendar('unselect');
            },
            droppable: true, // これにより、モノをカレンダーにドロップできます
            editable: true,
            eventLimit: true, 
    
        });
    
    });
    
[/code]


CC BY-SA 4.0
2020-01-30T02:03:24.833
62647
2022-02-28T11:00:25.107
2020-02-05T05:52:36.480
3060
37647
question
jquery fullcalendar
fullcalendarのイベント削除について


<https://fullcalendar.io/docs/v3/removeEvents>

[code]

    .fullCalendar( ‘removeEvents’ [, idOrFilter ] )
    
[/code]

指定のEventを削除するには第2引数にidやフィルターを追加することで消せるようです。

まずは公式のリファレンスを確認することをおすすめします。


CC BY-SA 4.0
2020-01-30T02:23:19.097
62648
2020-01-30T02:23:19.097
22665
62647
answer

[code]

    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    
       //ダブルクリックで予定削除（未完成）
        eventRender: function(calEvent, jsEvent, view) {
            (jsEvent).bind('dblclick', function() {
          if(!confirm('本当に削除しますか？')){
           return false;
          }else{
                $('#calendar').fullCalendar("removeEvents", calEvent._id);
          }
            });
        },
[/code]


CC BY-SA 4.0
2020-02-03T02:13:27.313
62735
2020-02-03T02:13:27.313
37556
62647
answer