スケジュール管理でオススメの軽量jqueryプラグイン「jq.schedule.js」

  • このエントリーをはてなブックマークに追加
  • このエントリーをはてなブックマークに追加

schedule

 

スケジュールなどのタイムラインを表示するjqueryプラグインはいろいろありますが、

なかなかしっくりくるものがないので、自作してみました。

 

ダウンロードはこちらから

スケジュール管理用jqueryプラグイン jq.schedule.js

 

使い方

プラグインをダウンロード後、/demo/ページをご覧いただくとどれだけシンプルなプラグインか確認できます。

jquery.jsとjquery.ui.jsに依存しておりますので、別途ご用意する必要があります。

 

機能

無制限でスケジュール管理する人数を増やすことができます。

ドラックアンドドロップでスケジュールを移動することが可能

時間を縮めたりのばしたりもドラックアンドドロップで可能

イベントを別の人に移動することも可能

コールバック引数も充実しており、Ajaxを使った様々な独自カスタマイズもできます。

見た目上の変更は、CSSにてカスタマイズできます。

 

よければ使ってみてくださいね。

 

You may also like...

7 Responses

  1. よっしー より:

    同一タスク内で、2つタスクバーが重なった場合、自動で1行ずれるようになっていますが
    この制御はどこで行っていますか?
    1行ずれなず、重ねて表示できればと思っています。

  2. みつひこ より:

    こんにちは。つい先日からjQueryさわり始めた初心者です。
    早速使わせて頂きました。シンプルでわかりやすいですね。

    ただ、2つほどお伺いしたいことがあります。
    ・0時~24時の範囲にした場合、0時と1時の間に不要な列が出てしまいます。
    ・バーを固定するにはどうすればよいか。

    コード拝見しましたが、まだ私が理解するには難しくて・・・。
    何卒、よろしくお願いします。

    • ateliee ateliee より:

      みつひこ様

      コメントありがとうございます。
      下記ご返答させていただきます。
      >>・0時~24時の範囲にした場合、0時と1時の間に不要な列が出てしまいます。
      オプション値にwidthTimeがありこちらが区切り時間となります。
      デフォルトは600秒となりますので、1時間3600秒なので3600に指定することで1時間区切りになるかと思います。

      >>・バーを固定するにはどうすればよいか。
      こちらは現状実装されていないかもしれません。
      もし実装できればgithubにてforkいただけますと助かります。

      jqueryは理解し易くとてもオススメなので頑張ってくださいね。

    • 弓長 より:

      この現象は、元々ソースのバグかもしれませんけど、計算の場合、ソースを修正したら、対応できます。

    • busyomono より:

      大分前のコメントに返信するのもへんですが、これからこのライブラリを使用する方の為ににコメントしておきます。
      > ・0時~24時の範囲にした場合、0時と1時の間に不要な列が出てしまいます。
      この件に関しまして先日自分の方で修正してプルリクエストして承認されました。
      直っていると思うので確認してみて下さい。

  3. みどり より:

    はじめまして。
    jquery初心者の者です。
    部署毎の社員のスケジュール一覧を作りたくて、たどり着きました。
    とても有り難く使わせて頂きます。

    クリックイベントでそれぞれのページにリンクさせたいんですが、
    スケジュールのdataにIDをいれても、その呼び出し方がわかりません。
    初歩的なことで申し訳ありあませんが、教えて頂けると嬉しいです。m(. .)m

    • ateliee ateliee より:

      みどりさん

      お世話になります。
      ご質問ありがとうございます。

      各イベントオプションの第二引数にて要素のデータを取得しているので遷移先urlを入力すると呼び出せるかと思います。

      click: function(node,data){
      location.href = data[‘data’].href;
      },

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です