Ajax
以前にも書いたことがあるが、Ajaxというのは紛らわしい言葉で、Ajaxライブラリーというと、Javascriptによる（サーバーとの）非同期通信（Ajax=Asynchronous javascript and XML）という意味と、エフェクトという意味の２つを大きく含んでいる。非同期通信…
これまでJSライブラリーとしてはYUI2.xを使ってきたのだが、どうもコードが煩雑になって生産性がよくない気がしてならない（自分の技量が低いのは否めないところではある）ので、人気の高いjQueryを試してみようと思う。 EzoGPでMyznalaやSyracavaを始めた頃…
YUIも2.8.1。以前に書いたログと同じことを日本語で実装したくて、XHRDataSourceを使って書いたのだがうまくいかない。前にログを書いていたときのYUIのバージョンは2.6だった。仕様は簡単で、以下の初期画面で「カタカナ」で書かれた商品名を入力する。 す…
以前、「これまで書いてきたログをまとめている」と書いた。ようやく、ある程度の格好になったので、SourceForge.jpでリリースにこぎつけた。このログにしばしば登場するmezawa氏とは、昨年より「EzoGP（えぞ・じー・ぴー）」というOSSプロジェクトを立ち上…
いろいろバタバタしてしまい、ブログの更新が滞っているのはうまくない。 mezawa氏と「RIA型アプリとMVC2モデルの関係性」についてメイルのやり取りをした。 これは以前から議論になっている話題。RIA型のアプリを頑張って作るという行為は、「頑張って画面…
先のログに書いたが、これまでのサンプルなどを「一まとめのコード」にしようとしている。 そのせいで、ログの更新も滞りがち。以前にサンプリングした、YUIのOfficial Examplesの中にDrag Dropの面白いサンプル（これ）があったので、それをモディファイし…
現在、これまでのログをまとめて、Javascript（YUI）とPHP5でアプリを作るためのツールを作成している。JavascriptとPHPなので、個人ユースを想定して、縛りの緩いライセンス（AL2.0）でダウンロードできるようにしたいと考えている。実地で使いそうなサンプ…
Javascriptでの禁則処理をエンハンスしたついでに、以前作成したPHPの方のプログラムにも同等の機能を実装しておく。 実装する機能は、 禁止する文字を■に置換するのは格好悪いので、化けそうも無い文字(列）に置換する。 というもの。禁止する文字と、その…
以前、作ったJavascriptでのコンバータ（禁則文字の置き換え目的）だが、あるアプリで使ったついで修正を加えた。この間のプログラムの以下の問題点を改善した。 １．禁則文字が続いた場合、■１つに置換されてしまう。 ２．■に置換するのは格好悪いので、化…
漠然としたタイトルだが、要するに「アプリを作ったとき、画面それぞれにヘルプをつけたい」というためのプログラムのこと。先日のログで作成した、（ログインユーザーのロールに応じた）メニュー機能を転用し、以下の仕様とした。 ヘルプの文面はMarkupで記…
先日のログのプログラムを発展させて、 単純なツリー形式にする。 画面にオーバーレイして出現する。 ようにしてみた。 以下は、初期画面のスナップショット。 「Menu」とあるリンクをクリックすると、YUIのAnimを使って、下のようにツリー状のメニューが浮…
YUI2.7.0とPHPを使って、以下のようなシンプルなメニューを作ってみたい。YUIに付属するメニューは、ちょっと好きになれない。 ログインしたユーザーに応じて、メニューの内容を変える。 単純なツリー形式にする。 画面にオーバーレイして出現する。 第１回…
少し前、YUI2.6.0から2.7.0へ移行をした際に、ColorAnimがおかしい、ことに気がついた（このログ）。 その時に気がつかなかったのだが、TreeViewもおかしいみたい。。。以下のようなマークアップからTreeViewを生成した際に、アンカーから生成したノードをク…
ログイン処理をもう少し実用向けにしてみたい。 以前、どこかのサイトで「認証はページに帰属させる」という記事を読んだ記憶がある。認証処理はアクションに帰属させるのが一般的であろうが、Ajaxを前提とした場合、ページに帰属させることで、少なくとも利…
前回（YUI2.7.0+PHP5でログインの処理を作る）の自然の流れとして、Logout処理を作ってみた。Javascriptから、XHRでPHPのプログラムを呼び出して以下の処理を行う。 SESSIONに紐づいているCOOKIEの廃棄 SESSION内に保管してデータの削除 また、これを確認す…
趣向を変えて、YUI2.7.0のPanelを使って、モーダル（modal）表示のログイン画面を作ってみた。ログインは、 E-Mailアドレス パスワード で行うことにし、この情報は、CSV形式でサーバーに置く（以下）。 dummy@dummy.com,password画面の動きは以下のようにす…
これまでの一連のログで一通りの道具立てが揃ったので、YUI2.7.0のDataTable（EditableTable;編集可能な表）を使って、以下のフラットファイル（CSV形式）のデータを更新・削除するプログラムを書いてみた。 01,北海道,テスト 02,青森,- 03,秋田,- 04,岩手,-…
これまでのしばらく、『YUI2.7.0のDataTable（特に、Editable Table:編集可能な表）の実用』を想定したコードを書いてきた。それらのログの中で、「（更新・削除されたデータが）表の中に一時的に保管される」と書いた。これは、「ページをリフレッシュする…
前回のログでは、YUI2.7.0のEditable Table（編集可能な表）について、更新・削除時に（DataTableオブジェクト内に）一時保管されるデータを、配列に蓄積するスクリプトを書いた。今回は、それを発展させて、その内容をサーバーに送るコードを書いてみる。こ…
ここまで、YUI2.7.0にあるEditable Table（編集可能な表）について、セルの更新と妥当性検証（Validation）、行の削除を行ってきた。 変更されたデータは、Page Scope（Javascriptオブジェクト）に保存されていて、実際の利用局面では、サーバーに送って永続…
YUI2.7.0のEditable Table（編集可能な表）について、バリデーションのコードを書いてきた。 バリデーションは、データの登録・更新に伴う処理。 今回は、 のような表を用意して、都道府県名の脇のマークをクリックしたら、行が削除される仕組みを作ってみる…
先のログで、DataTableのセルエディタ（Cell Editor）についてバリデータを自作してみた。ここで一点気になるのが、表の同一行内の値との「相関チェック」をどうするか？ということ。先のログのバリデーションでは、「そのセルの値」のみがチェックの対象。…
今回は、DataTableの「セルエディタ（Cell Editor）に設定するバリデータ（validator）」を自作してみる。YAHOO.widget.DataTable.validateNumberのソースを見ると、以下のように書けばいいことがわかる。 引数として入力値をとる関数 引数を検証し、OKならo…
簡単な入力フォームのバリデーション（入力検証、入力制限）について書いてきたが、編集可能なテーブルについても同様な処理をしたい。YUIのDataTableはよく出来ているので、バリデーションからサブミットまでのプロセスの雛形を作っておいても損はなさそう…
2009/5/27 ; 機能追加しました。（こちら）=========================== クライアントサイド（＝Javascriptのみ）での禁則処理を書いてみたので、同じ検証をAjax(XMLHttpRequest)を経由してサーバーサイドでの検証の書いてみた。 実際には、こっちを使うこと…
前回の戦略に沿って、コードを書いてみた。サンプルの初期画面は以下。 戦略通りに、テキスト入力フィールドには、グレーで入力ガイドを書いている。 以下のスクリーンショットは、入力途中でバリデーションがかかったところ。 入力して、次の入力フィールド…
地味ーに、バリデーションのコードを書いてきたが、超簡単にフォーム入力＆バリデーション（入力検証、入力制限）＆サブミットできるとうれしい。コンセプトは、 フォームに（簡単なルールで）inputタグを書くと、自動的にバリデーションがくっついて、サブ…
教科書を読むと、ブラウザーロケールを取得をするには以下のようなコードを書けばいいという。 if (window.navigator.language){ // for FF, Chrome, Safari _locale = window.navigator.language.toLowerCase(); } else if (window.navigator.userLanguage)…
前回のログのサンプルを改造して、MyValidator.class.phpを使った以下の仕様のサンプルを作った。 入力フィールドと（それに対応する）ボタンを複数個配置する。 ボタンのイベントハンドラを汎用化して、いちいち指定しなくてもいいようにする。 こうすると…
2009/4/22; Javascriptがバグっていたので修正 2009/4/22； Javascriptのコメントを修正 - MyValidator.class.phpを使って、ボタンを押すと特定の入力フィールドを検証するコードを書いてみる。画面の初期イメージは以下。 MyValidatorでは、日付の入力形式…
