2016-10-06 25 views
0

私のFullcalendarイベントにはリンクがあります。リンクは、公開されているウェブページ、pdfドキュメント、またはアクセスが制限されているウェブページを指しています。Fullcalendarイベントurl - URLが含まれている場合はクラスを追加

URL文字列に基づいてアイコンを追加するリンクをフォーマットするクラスを追加したいと考えています。
URLが含まれている場合:私はそれがであることとeventRender必要があると仮定し

  • "PDF" addclass "FC-PDF"
  • "制限" addclass "FC-ロック"

..私は正しい構文を見つけられません。誰かがこれで私を助けることができますか?

http://jsfiddle.net/lbriquet/oez9Ltym/

$('#calendar').fullCalendar({ 
      header: { 
      left: 'prev,next today', 
      center: 'title', 
      right: 'listDay,listWeek,month' 
      }, 
      views: { 
      listDay: { 
       buttonText: 'list day' 
      }, 
      listWeek: { 
       buttonText: 'list week' 
      } 
      }, 
      defaultView: 'listDay', 
      defaultDate: '2016-09-12', 
      navLinks: true, // can click day/week names to navigate views 
      events: [{ 
      title: 'Conference (website)', 
      start: '2016-09-11', 
      end: '2016-09-13', 
      url: "https://www.ted.com/talks" 
      }, { 
      title: 'Meeting (download document)', 
      start: '2016-09-12T10:30:00', 
      end: '2016-09-12T12:30:00', 
      url: "http://storage.ted.com/tedx/manuals/tedx_speaker_guide.pdf" 
      }, { 
      title: 'Lunch', 
      start: '2016-09-12T12:00:00' 
      }, { 
      title: 'Meeting (members only)', 
      start: '2016-09-12T14:30:00', 
      url: "http://www.dictionary.com/browse/restricted" 
      }, { 
      title: 'Happy Hour', 
      start: '2016-09-12T17:30:00' 
      }, { 
      title: 'Dinner', 
      start: '2016-09-12T20:00:00' 
      }], 
     eventRender: function eventRender(event, element, view) { 
     } 
     }); 

答えて

2

私は仕事にこれを得た方法は、私はそれは常に動作しない場合があります正規表現を扱うよりも簡単だと思うという理由だけで、イベントにタイプを追加することによってでした。イベントにはタイプは必要ありませんが、タイプはpdfrestrictedなど必要なものがあります。タイプが提供またはないとされている場合

eventRender: function eventRender(event, element, view) { 
    if(typeof event.type !== 'undefined') { 
    if(event.type === 'pdf') { 
     element.addClass('fc-pdf'); 
    } else if(event.type === 'restricted') { 
     element.addClass('fc-lock'); 
    } 
    } 
} 

チェックを確認するために、その後のタイプに基づいて、クラスを追加するためのif文:eventRenderで私は、次の追加しました。また、CSSセレクターを少し変更して、a.fc-lock.fc-lock aに変更して正しく表示できるようにしなければなりませんでした。これを示すJS Fiddleがあります。

+0

ありがとうございます@ Ryan89 これは私が必要とするものです! – lbriquet

関連する問題