PROGRAMMINGCodeIgniterでカレンダーアプリケーションを作る方法です。今回は基本的なサンプルですが、応用次第ではさまざまなWebアプリケーション開発に有効活用することができます。初期設定カレンダーライブラリを利用するカレンダーライブラリとDBを繋ぐブラウザからカレンダー内に情報をPOSTするそれではまとめてきます。部分はフォルダ名にあわせて変更してください。$this->calendar->generate();}}現時点で画面をロードすると以下となります。Prevリンクをクリックすると、URLに変化は起きますが、カレンダー自体は変化しません。理由は、カレンダーライブラリに情報は渡されていないからです。$month);}この状態へページを読み込みするとカレンダーは動作します。$monthがパラメータを受け取っていないためエラーが発生します。パラメータをオプショナルにすることで解決できます。具体的には、以下のとおりです。$month)ここまでで、ベーシックなカレンダーが完成しました。次からのステップでカレンダーには様々な情報を表示させるためには、先ほどつくったコントローラーをモデルとして利用したほうが使い勝手がよいです。$month);}}プログラムの最後がechoではなく、returnになっています。$month);}基礎知識ですが、以下のプログラムに関して。$month);上記プログラムは、以下のように書き換えることも可能です。?></body></html>ここまでで、DBとの情報のやり取りに関して、より利便性のたかいカレンダーが完成しました。次にカレンダー内に情報を入れ込む機能を作成していきます。$cal_data);すると、17日と25日にURLパラメータが渡されるようになります。次回以降のステップでDBを使うので、ここで一度テーブルを作成します。テーブル名:calendarカラム数:2次に以下のようにテスト用データを挿入しておきます。DBからカレンダー情報を取得できるようにする編集ファイル:models/mycal_model.php以下のプログラムを変更します。$month);get_calendar_dataを作成していきます。03,,,)のように返しますが、カレンダークラスは(1,2,3,4,,,)のうように返します。その問題を+0で解決しています。$cal_data;}すると、2014-08-26の部分のリンクが、ここをテスト中になっているはずです。次に、リンクではなく、カレンダー内に文字を出現させていきます。編集ファイル:models/mycal_model.phpカレンダーテンプレートを作成することで、カレンダーのデザインを100%コントロールできます。Smartyみたいなテンプレートですね。以下のとおりに修正してください。{/cal_cell_end}{cal_row_end}{/cal_row_end}{table_close}{/table_close}';}次に、CSS。#00F;}これで、カレンダー内にDB情報が表示されるようになりました。カレンダーテンプレート作成方法の詳細は以下からどうぞ。次にブラウザから情報をPOSTできるようにします。$data));}動作テストを行なってみます。http://localhost/calendar/mycal/display/にアクセスした際に、displayコントローラーが実行されます。displayコントローラーでは、Mycal_modelが読み込まれ、Mycal_model内のgenerateメソッドが実行されます。いうことは、generateメソッド内で、DBへの情報追加機能がテストできることになります。プログラムは以下です。$cal_data);}ページ読み込みをすると、情報がDBに挿入され、カレンダーに表示されたことがわかります。ページを再度読み込むと以下のエラーが発生します。81日本語が文字化けしちゃっていますが、要するに、情報の入っているDBに、再度情報を挿入(insert)しようとしたためにエラーが発生しています。カラムに情報は入っている場合は、insertではなく、updateするようにプログラムを書き換える必要があります。$data));}}これで無事にエラーから解消されました。この時点で、テストコードを削除して、DBテーブルも空にしておいてください。jQueryでデータ挿入できる機能をつくる編集ファイル:views/mycal.php各日付をクリックしたら、日付を取得できるようにします。prompt:ポップアップでテキストのインプットボックスが出現します。dayがPostされるday:day_num,//prompt部分で入力された情報data:day_data},success:function(msg){location.reload();}});}})})以上でフロントエンド部分んは動くようになります。次はAJAXデータをDBに挿入していきます。dayがPOSTされたら以下を実行。nullがあるので、正常に動きません。$year、$monthがない場合は以下のように初期化(イニシャライズ)しておきます。date('m');}$this->load->model("Mycal_model");これで、99%完成です。最後に少しだけ追加して、ユーザビリティを上げます。値が挿入されている場合は、Prompt画面に情報が表示されるようにします。上記をクリックした場合に、以下のように表示されるようにします。※現状のままだと、ボックスが空です。■変更後promptに第2引数をわたす編集ファイル:views/mycal.phpHTML内部にあるvalueをフェッチできるようにします。$(this).find(".content").html());以上で完成です!お疲れさまでした。:16記事で解説】SEOプログラミング・ブログの学習の有料ロードマップ【公開】プログラミング独立の完全ロードマップ【月20万を稼ぐ道】PROGRAMMINGブログ型アフィリエイトの完全講義【ブログ歴6年の僕の集大成です】BLOGお仕事の依頼はこちらからどうぞWebマーケティングコンサルティングの依頼ページSEO25万円:ビジネススタートにおけるWeb制作・運用設計をサポートしますPROGRAMMINGマナブブログ・アフィリエイト・プログラミングを愛しています。ブログを書きまくる→ブログ収益7桁達成。普段はバンコクを中心に南国にひきこもりつつ、生活費は5万円くらいで生きています。me!ブログ・アフィリエイト・プログラミングを愛しています。ブログを書きまくる→ブログ収益7桁達成。普段はバンコクを中心に南国にひきこもりつつ、生活費は5万円くらいで生きています。