CakePHP AjaxでJSONデータの出力の仕方とcontent-typeについて – MT Systems
以前、Ajax通信で結果を出力する際XMLデータだったので、Content-Typeを「application/xml」か「text /xml」にしようと、RequestHandlerのメソッド(setContent)をいろいろ試したのだが、いつも「text/html */*」となり、なかなか思うように出力できなかった。あの時は、クライアント側で支障なく利用できたので、放り出してしまった。 今回、クライアント側のJavaScriptで扱いやすいように、JSONでデータを出力することにしたので、前回クリアできなかったハードルに再 挑戦することとなった。と言っても、CakePHPについは世界中で多くの情報が公開されているため、作業は検索と動作チェックだけだったけど (^_^;)。 お題は、「ユーザ番号をAjaxのGETで渡し、DBのユーザ情報をJSONで出力する」という、簡単なお話し。クライア
jQuery UI API 1.8.4 日本語リファレンス - StackTrace
jQuery UI API 1.8.6 の日本語リファレンスです。 ソースコードを読み、jQuery UI(公式サイト)のドキュメントを参考に解説しました。 また、全ての解説に、実際に実行できるサンプルを付けました。 jQuery UIとは jQuery UIとは、jQueryライブラリ上に構築された強力なユーザインターフェースライブラリです。 jQuery UIの構成 jQuery UI 1.8.6 は、大きく分けて「インタラクション」「ウィジェット」「ユーティリティ」「ビジュアル効果」3つのカテゴリに分けることができます。 それぞれ、次の機能が提供されています。 インタラクション 対話型ユーザインターフェースを構築するためのライブラリ ライブラリ説明対応ファイル
jQueryの日本語の解説サイトと国産のプラグイン集
MopBox 複数パネル（デモには100以上のパネルも）の表示にも対応した、画像・Flash・動画などを表示できるドラッグ移動可能なボックス。
ドラッグを必要とする様々なUI実装に使える「Dragdealer JS」:phpspot開発日誌
Dragdealer JS ドラッグを必要とする様々なUI実装に使える「Dragdealer JS」。 マウスを使ったドラッグ＆ドロップ操作というのは、スクロールバーや、スライダー等色々と存在しますが、そういった処理を一手に引き受けてくれるライブラリのご紹介です。 要素を動かした後のコールバック関数が指定できるので、ドラッグ＆ドロップ後の処理が自由に記述できてアイデア次第ではなかなか便利なUIが作れそうです。 横スライダー 縦スライダーで文字サイズを変更するサンプル 横スライダーで文字サイズを変更するサンプル ドラッグで移動させるスライドショー 予め用意されているUI実装をするのもよいですが、ドラッグ＆ドロップに関する新しいUIを思いついた場合にも参考にしてみるとよさそう。 関連エントリ IEにも対応！ブラウザ上でローカルにストレージを作るJavaScriptライブラリ「jStorage」
ajaxで簡単ファイルアップロードが可能なjQueryプラグイン「jQuery.upload」:phpspot開発日誌
jQuery.upload: A simple ajax file upload plugin ajaxで簡単ファイルアップロードが可能なjQueryプラグイン「jQuery.upload」 同じページ内に生成したiframeへデータをPOSTすることで、非同期にファイルをアップロードが可能にするものです。 ファイルを選択すると即時にアップロードが開始するのが特徴 アップロードを完了すると次のように、ファイル名・サイズといったファイル情報が表示されるデモが公開されています。 ファイルアップロードを頻繁に行うようなケースにおいて、便利に使えるインタフェースが組み込めそうですね。 関連エントリ ajaxファイルアップロードに使えるjQueryプラグインいろいろ PHPでファイルアップロードの処理を超簡単にするクラス例「EasyUp」 ファイルアップロードの際に便利なFlash/JavaScri
スクロールするとAjaxで次の内容をガンガン読んでくれるjQueryプラグイン「AjaxScroll」:phpspot開発日誌
スクロールするとAjaxで次の内容をガンガン読んでくれるjQueryプラグイン「AjaxScroll」 2010年03月31日- AjaxScroll ? Ajax Scroll jQuery Plugin | blogfreakz.com スクロールするとAjaxで次の内容をガンガン読んでくれるjQueryプラグイン「AjaxScroll」 「MSN Image Search」は画面遷移なしに画像をガンガンよんでくれて、スクロールすれば次の画像を見れるためストレスが少なく、画像を探せます。 これと同様の機能を実現するためのjQueryプラグインのご紹介です。 デモページはこちら。スクロールすると次の画像を読んでいっているのが分かると思います。 Ajaxで次の内容を読むので、一回における転送量を少なくした上で、利用者には画面遷移なしの利便性を提供出来ると言うわけですね。 垂直方向だけでなく
40分で覚える！jQuery速習講座 (1/6)
いまやWeb制作に欠かせなくなったJavaScript。でも、「JavaScriptはほとんど“アリモノ”で済ませている」という方も多いのでは？ そこで、WebデザイナーやマークアップエンジニアなどのWeb制作者の方向けに、いま一番人気のJavaScriptライブラリー「jQuery」の基本を学べる特別レッスンをお届けします。題して、「40分で覚えるjQuery」。要点だけにぎゅっと絞って解説しますので、手を動かしながら今すぐjQueryを始めましょう。 【0分目：導入編】 jQueryのダウンロードと利用方法 jQueryのライブラリー本体（JavaScriptファイル）は公式サイトからダウンロードし、head要素などにscript要素を書いて読み込みます。
jQuery 1.4登場、素晴らしい速度 | エンタープライズ | マイコミジャーナル
jQuery: The Write Less, Do More, JavaScript Library jQueryチームは2009年1月14日(米国時間)、最新のメジャーバージョンとなるjQuery 1.4を公開した。jQueryはJavaScriptで開発されたAjaxアプリケーションフレームワーク。軽量で高速、さまざまなシーンで採用されるもっとも人気のあるフレームワークのひとつであり、将来のFirefoxでもデフォルトで採用されるとみられる。 jQuery 1.4では1年間に渡って取り組まれた開発の成果が取り込まれている。より開発を便利にする機能の追加、テストケースカバレッジを広げ包括的なバグフィックスの実施などがある。しかし、もっとも注目されるのは、実行速度をさらに高速化させた点にある。 主要メソッドの呼び出し回数比較 - jQuery 1.4 Releasedより抜粋 .css(
ソフトウェアキーボードを実装するjQueryプラグイン – creamu
フォームのinputやtextarea要素にキーボード機能をつけたい。 そんなときにおすすめなのが、『jQuery Keypad』。ソフトウェアキーボードを実装するjQueryプラグインです。 ↑の例は、inputにフォーカスすると、キーボードが現れるタイプです。キーボードには、「閉じる」「クリア」「一文字削除」機能がついていて、「View」ボタンを押すと、入力した値を確認できますね。 ライセンスはGPL and MITになっているので、自由に使えそうです。 一度見てみてください。 jQuery Keypad LADでいろいろと購入。パーカとボーダーT、ジャケット、ニット帽など。全部かなり気に入りました。09 A/WのBLACK PAINTINGのものが30%OFF〜になっていたので、いいのが揃っていましたね。 パーカはほしかったやつだからめちゃうれしい。
Twitterのようにスマートな通知バーを一瞬で実装できるjQueryプラグイン「jQuery Notify bar」:phpspot開発日誌
Twitterのようにスマートな通知バーを一瞬で実装できるjQueryプラグイン「jQuery Notify bar」 2010年01月08日- jQuery 'Notify bar' Twitterのようにスマートな通知バーを一瞬で実装できるjQueryプラグイン「jQuery Notify bar」。 ページの上部にアニメーションされながら表示されるあの通知バーです。 時間がたつとアニメーションしながらスマートに消えてくれます。ページデザインがどんなものであろうと影響を受けません。 色を変えて、エラーモードにしてみたり、成功モードにしてみたり自由にできます。 実装は超簡単で、次のように初期化するだけです。 $(function () { $.notifyBar({ html: "メッセージ", delay: 2000, // 表示するミリ秒数 animationSpeed: "norm
jQueryをよく使う人に使えそうな７つのチートシート:phpspot開発日誌
jQueryをよく使う人に使えそうな７つのチートシートがまとまっています。 内容が被ってしまう部分もあると思いますが、７種類の中から自分が使いやすいものを組み合わせて置いておくと便利ですね。 ajaxブームの2005年から4年。すっかりjQueryが地位を確立してしまった感がありますね。 以下のエントリを参照してください。 7 jQuery Cheatsheets For Every Designer & Developer to Have | TutZone 関連エントリ ボックス要素をレンガ状に綺麗に整列させる「jQuery Masonry」が凄い GoogleMapみたいに画像をズーム＆グリグリ移動できるjQueryプラグイン「Mapbox」 少ないスペース内でコンテンツをグリグリスクロールさせられるjQueryプラグイン「Flips」 jQuery用のGUIコンポーネントプロジェク
データベースをAJAXで直接編集できるテーブルがインスタントに作れる「DHX Quick Tables」が便利:phpspot開発日誌
データベースをAJAXで直接編集できるテーブルがインスタントに作れる「DHX Quick Tables」が便利 2009年12月17日- データベースをAJAXで直接編集できるテーブルがインスタントに作れる「DHX Quick Tables」が便利そうです。 簡単にいうと、データベースとテーブルを指定すれば次のような、AJAXで即座に編集が可能なテーブルを作成することができます。 各カラムは「編集可能」や「読み込みオンリー」に指定することができて、好きなカラムのみ編集させることができます。 データの追加、削除、編集といったこともAJAXで実施することができます。 データベースを扱う部分の管理画面とかに使えるスクリプトを動的に作ることができてしまいますね。 利用には条件があって、id に auto_increment なint値を指定しているテーブルにしか使うことができません。 設置方法は、
第3回 Command Line APIとその活用、各タブからのデバッグ方法 | gihyo.jp
さて、前回はConsole APIの解説とそれを利用してのデバッグについて簡単な解説を行いました。 今回は、Firebugに実装されているもう1つのAPIである、Command Line APIや、各タブの機能を利用してのデバッグ方法について解説をしていきたいと思います。 Command Line API Command Line APIはFirebugのConsoleタブから利用することができます。ただし、グローバルですでに利用されている名前については利用できません。例えばPrototypeやjQueryが利用されているページのConsoleでは$()関数はそれらのライブラリのものが実行されます。 利用できるAPIは以下の通りです。 $(id) IDを渡すと、そのID属性のHTML要素を返します。 $$(selector) CSSセレクタを渡すと、該当するHTMLの要素を配列で返します。
ASCII.jp：jQueryで作る画像ギャラリーのチュートリアル｜Web制作の現場で使えるjQuery UIデザイン入門
ページを遷移せずにサムネイルの一覧から画像を選んで拡大表示する「画像ギャラリー」は、jQueryを使えば比較的簡単に作れます。今回は、シンプルなデザインの画像ギャラリーの作成方法を紹介します。 画像ギャラリーの基本部分を作ってみよう 作成するのは、左側にサムネイル画像の一覧、右側にメイン画像を配置し、サムネイルをクリックするとメイン画像がページを遷移せずに切り替わる画像ギャラリー機能です。 はじめに、もっともシンプルな「サムネイルをクリックするとメイン画像が切り換わるページ」を作成します。 WebページのHTML／XHTML（以下HTML）とCSSは以下のようになっています。サムネイルの一覧部分はul／li要素でマークアップし、サムネイル画像はそれぞれ a要素で包みます。a要素のhref属性にはサムネイルに対応するメイン画像のURLを設定します。メイン画像は div#main内にimg要素
ドラッグ＆ドロップで数値の設定が出来る便利ＵＩを実装できる「jquery-drag-spinbox」:phpspot開発日誌
ドラッグ＆ドロップで数値の設定が出来る便利ＵＩを実装できる「jquery-drag-spinbox」 2009年10月30日- ドラッグ＆ドロップで数値の設定が出来る便利ＵＩを実装できる「jquery-drag-spinbox」。 普通、数値入力というと、ボックスに直接入力したり、ボタンを連打したりして上下させますが、このSpinBoxを使えば、画像上でクリック→上 or 下にドラッグすることで簡単に数値の調整が出来ます。 デモページ 名前の通り、jQueryベースで作成されていますので比較的簡単に使うことが可能です。 以下のエントリを参照してください。 HowToSetupJapanese - jquery-drag-spinbox - Project Hosting on Google Code
連載：jQuery逆引きリファレンス 第1回 セレクタ編 － ＠IT
jQueryは近年、JavaScriptライブラリの中でも高い人気を持ち、急速に普及してきたライブラリです。jQuery自体はオープンソースで開発が進められるライブラリですが、2008年9月にマイクロソフトが正式サポートすることを表明したことから、今後は、ASP.NETの世界でも採用される機会が多くなってくると予想されます。本連載が、これからjQueryを利用される方の有用な資料となれば幸いです。 なお、本連載はリファレンスという性質上、入門レベルからの解説は行っていません。jQueryの基本については、拙稿「ASP.NETプログラマーのためのjQuery入門」も併せて参照することをお勧めします。 それではさっそく始めましょう。まずは、jQueryのキモともいえる「$()関数」で使える、さまざまなセレクタ構文についてまとめていきます。 id値で要素を特定するには？ タグ名で要素を特定するに
一日で学ぶ jQuery(ラボブログ)
スパイスラボ神部です。 OpenSocial アプリの開発を効率化するために、jOpenSocial か opensocial-jquery のどちらかを使いたいのですが、そのためにはまず jQuery について学ばないと行けないようなので、jQuery についてざっと調べてみました。 -AJAXが好きだ！ - Favorites! Write less, Do more -jQuery: The Write Less, Do More, JavaScript Library まずは公式。 リファレンス -jQuery 1.3.2 日本語リファレンス 参考になりそうなリソース いろんな記事を見ると、とりあえずは jQuery を使うと、構造化された状態でリッチアプリケーションが組めるという部分が強調されている記事が多いような気がします。「jQuery + AJAX で RIA な UI
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
IDEA * IDEA
IDEA * IDEA
NicEditの日本語化 - capsctrldays(2009-01-12)