2011-01-19 8 views
3

私はFullCalendarを使用して予定スケジューリングモジュールを作成しています。 FullCalendar:EventClickの座標に関連する開始時刻を取得できますか?

  • 利用可能な実際のスケジュールの予定のために - -

  • は、私がその任命ようFullCalendarを変更可能なタイムスロットのために

    • 予定: はこのように、主な目標は、2種類のイベントを利用することです型イベントが特定の色にレンダリングされ、使用可能な型イベントが別の色にレンダリングされます。

      主な目的は
      に誰かをできるようにすることです - ビュー利用可能なタイムスロット
      - 予定型イベント
      をスケジュールするために、そのタイムスロットの全部または一部を選択する - 予定
      の重複禁止する機能を - いつでもユーザーが何もしません利用可能なタイムスロット外のクリック

      利用可能なイベントが最初にレンダリングされ、その後、予定タイプのイベントが最後にレンダリングされます。
      重複イベントが横並びに表示されないように修正されたフルカレンダーが表示されますが、予定イベントは使用可能イベントの上に表示されます。

      イベントの内部最初にイベントの種類を確認しています。 アポイントメントイベントの場合は、そのアポイントイベントを編集したいだけです。

      Availableイベントであれば、新しい予定タイプイベントを作成したいと思います。選択
      上でCreateEventと、このようにeventClick
      にUpdateClickを呼び出します:それはちょうどdayClickイベントである場合

      、その後、

      もともと無視し、私は、関数を呼び出します

      select : CreateEvent, 
      eventClick : UpdateClick, 
      

      これらの関数ポップアップイベントを追加または編集できるダイアログ。
      私は彼らが既存の利用可能なイベントスロット内部の予定をスケジュールすることができるようにしたいので、私は多分、私は以下のように同じプロシージャを呼び出すと考えていた:

      eventClick: function(calEvent, jsEvent, view) { 
      
      if (calEvent.type=='AVAILABLE') { 
      CreateEvent;  // schedule new appt. 
      } else if (calEvent.type=='APPOINTMENT') { 
      
      UpdateClick; // edit existing appt. 
      } 
      

      }

      そのコードの問題これはルーチンです:CreateEventは開始時刻と終了時刻を必要とします。

      function CreateEvent(start, end, allDay) { 
      $('#calendar').fullCalendar('unselect'); 
      var id = $(formStart + formEnd); 
      
      $(id).dialog({ 
          title : 'Create', 
          modal : true, 
          autoOpen : true, 
          width : "340px", 
          resizable : false, 
          close : function(event, ui) { 
          $(id).html(''); 
          }, 
          buttons : { 
          "Ok" : function() { 
          title = document.getElementById('titleId').value; 
      
          $(id).dialog("close"); 
          ev = { 
          title : title, 
          start : start.getTime()/1000, 
          end : end.getTime()/1000, 
          allDay : allDay 
          }; 
          if (!title) { 
          return; 
          } 
          serverSave(ev); 
          }, 
          "Cancel" : function() { 
          $(id).dialog("close"); 
          } 
          } 
      });} 
      

      イベント開始とイベント終了は、使用可能な完全なタイムスロットになるため、使用しません。 予定をスケジューリングするとき、利用可能なタイムスロットの一部のみを使用できます。

      実際のマウスポインタのY座標を予定の開始時刻に変換する方法を知っていますか?

      、および/または

      あなたはFullCalendarとの約束スケジューリングのこのタイプを処理する方がはるかに簡単な方法を参照していますか?

      おかげ

    +0

    私はこの問題の代替ソリューションを見つけたと思います。ユーザーが利用可能なタイムスロットをクリックすると、使用可能なスロット内に時間オプションが表示されます。彼らは時間範囲を選択することができ、次に予定タイプイベントが作成されます。申し訳ありませんが、この質問は多少詳細になったかもしれません。すでにこれを検討してくれた方々に感謝します。 – Trent

    +2

    答えにあなたのソリューションを投稿できますか?それは役に立つでしょう:-) – Doomsday

    答えて

    0

    私はjsEventカレンダースロット内のクリックイベントの座標を含む多くの情報が含まれていることを知っています。 (eventClick documentation about PageX & pageYを参照してください)ここで座標について語ります。

    もう1つの解決策は、昼間のビューに切り替えることで、利用可能な時間を選択/表示することがより簡単になるようにすることです。このスイッチは、モーダル型のポップアップでも処理できます。

    希望に役立ちます。

    関連する問題