使用qtip2從fullCalendar中刪除元素

我目前正在嘗試將qtip2添加到fullCalendar窗口中，因此我可以顯示qtip並有鏈接/按鈕來刪除日曆上的選定事件，很不幸，我遇到了麻煩。這裏是我的fullCalendar是什麼樣子：使用qtip2從fullCalendar中刪除元素

$('#calendar_main').fullCalendar({ 
      header: { 
       left: 'prev,next today', 
       center: 'title', 
       right: 'month,agendaWeek,agendaDay' 
      }, 
      defaultView:'agendaWeek', 
      minTime:8, 
      height:600, 
      maxTime:20, 
      editable: true, 
      allDaySlot:false, 
      theme: true, 
      firstDay: 1, 
      selectable: true, 
       selectHelper: true, 

      eventRender: function(event, element) { 
       element.qtip({ 
       content: "<a onlick='alert('Remove')> Remove me</a>", 
       title: { 
        text: 'RDV', 
         button: false 
       } 
       }, 
       position: { 
        at: 'right-bottom' 
       }, 
       show: { 
        solo: true 
       }, 
       hide: false, 
       style: 'ui-tooltip-light ui-tooltip-rounded' 
       }); 
      } 
     });

我相信這個問題坐鎮qtip的內容屬性中，但不知道爲什麼，這是行不通的。在這種情況下，我只是試圖顯示一個警報，但它不工作（Qtip顯示，但當我點擊「刪除我」時，什麼也沒有發生。一旦我得到這個工作，我將能夠取代警報與我自己的JS函數，將在我的數據庫中刪除選定的事件

PS：我與Adobe AIR的工作，不知道這可能是一個問題

來源

2012-02-23 batmat

好一個，你需要逃脫單。報價以在警報的字符串。

第二，你忘了在標籤單引號關閉警告。希望它可以幫助...

'<a onlick="alert(\'Remove\');"> Remove me</a>'

這是它應該看起來。

來源

2012-02-23 17:19:32

謝謝胡安，不幸的是它仍然不顯示警報框。我想我已經找到了一個解決方法，我顯示一個div，而我把我的JS函數的調用直接放在div代碼中。目前這是一個好的解決方案。再次感謝。 – batmat 2012-02-24 08:10:29

可能你正在使用qTip的調用過程，但實際上你正在使用qTip2。在真正的（源腳本）使用舊版本qTip 1.00xxx，一切都會好的 - 我確實做到了。

來源

2012-02-25 09:35:43 Andrew

我實際上在做同樣的事情，我可以很好地將其刪除。我遇到的唯一問題是，當事件被破壞時，qtip會一直存在，所以遇到eventDestroy從未被調用的問題。

無論如何，我打電話calendarEventRender：

 $('#calendar').fullCalendar({ 
      firstDay: 1, 
      header: { 
       left: '', 
       center: '', 
       right: '' 
      }, 
      defaultView: 'agendaWeek', 
      allDaySlot: false, 
      columnFormat: { 
       week: 'ddd' 
      }, 
      selectable: true, 
      selectHelper: true, 
      editable: true, 
      droppable: true, 
      eventRender: function(event, element) { 
       calendarEventRender(event, element); 
      } 
     });

這裏是我的功能：

function calendarEventRender(event, element) 
{ 
    element.qtip({ 
     content: { 
      title: { text: event.title }, 
      text: '<button type="button" onclick="removeEvent(' + event.id + ')">Delete</button>' 
     }, 
     show: { 
      event: 'click', 
      solo: true 
     }, 
     hide: { 
      event: 'unfocus click' 
     } 
    }); 
} 

function removeEvent(eventId, userId) 
{  
    //Delete the event 
    $('#calendar').fullCalendar('removeEvents', eventId); 
}

而這一切似乎工作。我沒有時間去抓取代碼，但希望這有助於。同樣在未來，如果你可以得到一個http://jsfiddle.net/不工作，人們可以更容易地測試和修復它。

嗯所以我創建了一個jsfiddleto測試它的全部：http://jsfiddle.net/MusicMonkey5555/pZdyt/1/ 它似乎不工作在那裏。我的猜測是它是jQuery或qtip或fullcalendar版本。這是與jsfiddle的一個問題是獲取正確的版本。一個我在我的網站的工作有以下幾點：

//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js 
//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js 
//ajax.googleapis.com/ajax/libs/jqueryui/1.10.1/themes/base/jquery-ui.css 
//cdnjs.cloudflare.com/ajax/libs/fullcalendar/1.6.4/fullcalendar.min.js 
//cdnjs.cloudflare.com/ajax/libs/fullcalendar/1.6.4/fullcalendar.css 
//cdnjs.cloudflare.com/ajax/libs/fullcalendar/1.6.4/fullcalendar.print.css 
//cdnjs.cloudflare.com/ajax/libs/qtip2/2.1.1/jquery.qtip.min.js 
//cdnjs.cloudflare.com/ajax/libs/qtip2/2.1.1/jquery.qtip.min.css

所以我會建議嘗試使用這些版本，看看它是否工作。大多數情況下，這是因爲jquery有一個bug，你需要一個不同的版本。

來源

2013-10-09 17:48:10 MusicMonkey5555

使用qtip2從fullCalendar中刪除元素

回答

相關問題