2012-02-23 8 views
0

現在、qtipを表示してカレンダーで選択したイベントを削除するためのリンク/ボタンがあるので、qtip2をfullCalendarウィンドウに追加しようとしています。私は問題はQティップのコンテンツ属性の中に座っていると考えているが、これは動作しない理由はわからない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' 
       }); 
      } 
     }); 

:ここに私のfullCalendarのように見えるものです。この場合、警告を表示しようとしているだけですが、Qtipは表示されますが、「削除」をクリックすると何も起こりません。私のDBで選択したイベントを削除します私自身のJS機能

PS:私はこれが問題になることができれば必ず、Adobe AIRのではない働いています

答えて

0

まあ1について、あなたはシングルをエスケープする必要がありますアラート内の文字列を形成する。

そして第二に、あなたがタグ内の単一引用符でアラートを閉じるのを忘れていました。それが役に立てば幸い...

を引用

これはどのように見えるかです。

+0

ありがとうJuan、残念ながら、それでもアラートボックスは表示されません。私は代わりにdivを表示し、私のJS関数の呼び出しを直接divコードに入れるという回避策を見つけたと思います。これは今のところ解決策です。再度、感謝します。 – batmat

0

おそらくあなたはqTipの呼び出し手順を使用していますが、実際はqTip2を使用しています。実際の(ソーススクリプト)古いバージョンのqTip 1.00xxxで使用してください。

0

私は実際に同じことをしています。私はそれをうまく取り除くことができます。私が遭遇する唯一の問題は、イベントが破棄されて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の問題の1つで、すべてのバージョンが正しいものになっています。私は自分のサイトに取り組んでいる1は、以下のとおりである:

//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にバグがあり、別のバージョンが必要なためです。

関連する問題