Indicator type : Background color : # Transparent background Foreground color : # Create easily your own ajax loader icon : Select the type of indicator you want Enter the background code color you want (tick "Transparent background" if you don't want one Enter the foreground code color you want Press "Generate it"
jQueryとCakePHPの異種格闘技戦。jQueryが勝っとる。これからはjQueryか。prototypeはそれ自体が汎用的な単語のため、フェアな勝負にならない。 そういうわけでjQueryのajaxを使ってみて(とりあえず挫折)したのでメモ。(いや、ajaxを使うというだけなら簡単。使い方が悪いだけ。) $.ajax()を使えばいい。 $.ajax({ url: 'hogehoge.htm', type: 'POST', dataType: 'json', // xml、 html、script、json data: params, timeout: 1000, error: function(){ // エラー時 alert('Error'); }, success: function(htm){ // コールバック } }); 上記コードで’hogehoge.htm’にpost
これまで、 HTML 文書から直接 CGI を呼び出すことで、掲示板みたいなものを実現してきました。 今回は、 JavaScript ファイルを追加して、いわゆる "Ajax" に挑戦してみます。 HTML : visitor_world6.html 今回のメッセージ送信画面は、今までとちょっと違います。 メッセージを記入する "TextBox" と "Submit" "Clear" ボタンが並んでいる所までは同じなのですが、今回は、その下にメッセージのリストが表示されています。 "TextBox" にメッセージを記入して、 "Submit" ボタンが押したら、今までは CGI を直接呼び出していました。 今回は、一旦 "JavaScript" が "Submit" ボタンのクリックを受けとめて、そこから改めて CGI を呼び出して、メッセージの追加とメッセージ一覧の取り寄せを行います。
このデータを読み込み利用するにはdata = eval("("+データ+")")とすると変数dataにJSONで定義されたプロパティの値が入ります。例えば以下のようなJSONファイルがあるとします。 このデータを変数dataに読み込んだとします。userIDプロパティの値を読み出すにはdata.userIDと記述します。するとajaxの文字が返されます。同様にdata.userPWとするとxanaduの文字が返されます。単純にオブジェクト名.プロパティ名の記述で済みます。プロパティの値には関数なども定義することができます。これによりオブジェクト名.プロパティ名()として末尾にカッコを付加した場合にプロパティの内容=関数が実行されます。つまりメソッドを定義したのと同じことになります。 それでは実際のデータを読み込み表示してみます。以下の商品名とそれに関するデータが記述されたJSONデータを読
今回使用する「Dialog」「Draggables」「Droppables」「Sortables」に必要なファイルは以下の通りです。 themes/ jquery-1.2.3.min.js jquery.dimensions.js ui.mouse.js ui.resizable.js ui.dialog.js ui.draggable.js ui.draggable.ext.js ui.droppable.js ui.droppable.ext.js ui.sortable.ext.js ui.sortable.js jQuery UI 1.5bを使うために、今回は同梱されているjQuery 1.2.3を使うことにします。バージョンが上がりますが、これまでのサンプルの動作に影響はありません。 ライブラリの設定 ライブラリの各ファイルを、head要素の子要素に以下のように指定します(
16 26 08 2007 Ajaxでどんな事が出来るのかを知るサンプル集26種類 jQuery interface編 jQuery, Samples, Ajax 海外のjQueryを使ったAjaxサンプル集に日本語の紹介文をつけた記事 Effects Ajaxエフェクト集 要素の出現・消滅など全62種類のAjaxエフェクトサンプル Test new animate function 要素のAjaxアニメーションジェネレーター Use new functions stop, stopAll and pause to clear queue and stop flickering Ajaxでディレイ(遅延)を設定できるツールチップを表示サンプル Draggables | Droppables Ajaxでドロップ&ドラッグ出来るサンプル10種類 Sortables list
はじめに JavaScriptと非同期XML通信を使用することで、Webブラウザ上でリッチなUIを実現することができる、Ajax(Asynchronous Javascript And Xml)が最近流行です。しかし、実際にリッチなUIを構築するためには、サーバサイドもさることながら、JavaScriptを使ったクライアントサイドの複雑なコーディングを行う必要があります。 今回ご紹介するAjaxTags・AjaxFacesは、Ajaxを使った高機能なUIコンポーネントです。どちらもクライアントサイドのJavaScriptコーディングを行うことなく、JSPタグを記述するだけで使用することができます。AjaxTagsはJavaServer Pages(以下、JSPと表記)上で、AjaxFacesはJavaServer Faces(以下、JSFと表記)上で動作します。 AjaxTagsの動作原理
最近,Webエンジニアのまわりで注目されている技術に「Ajax」(エイジャックス)があります。従来のWebアプリケーションはインタラクティブな処理の際,ユーザーにページのリロード作業を強いることが多く,決して操作性が良いとは言えませんでした。しかしAjaxを利用すると,サーバーと非同期な通信ができるので,ページをリロードすることなくコンテンツを更新できます。このためデスクトップ・アプリケーションと同様な操作性を持つWebアプリケーションを作成できます。本連載では,実際にAjaxアプリケーションを開発しながら,Ajaxアプリケーションの動作の仕組みや,既存のWebアプリケーションとの違い,実装上の注意点などについて紹介していきます。 目次 第1回 古くて新しいアーキテクチャ 第2回 インクリメンタル検索を実現(クライアント編) 第3回 インクリメンタル検索を実現(サーバー編) 第4回 予測・
最近,Webエンジニアのまわりで注目されている技術に「Ajax」(エイジャックス)があります。従来のWebアプリケーションはインタラクティブな処理の際,ユーザーにページのリロード作業を強いることが多く,決して操作性が良いとは言えませんでした。しかしAjaxを利用すると,サーバーと非同期な通信ができるので,ページをリロードすることなくコンテンツを更新できます。このためデスクトップ・アプリケーションと同様な操作性を持つWebアプリケーションを作成できます。本連載では,実際にAjaxアプリケーションを開発しながら,Ajaxアプリケーションの動作の仕組みや,既存のWebアプリケーションとの違い,実装上の注意点などについて紹介していきます。 「枯れた技術」を組み合わせる 筆者にとってAjaxの第一印象は強烈でした。「Google Map」のスムーズな地図操作,「Google Suggest」のリアル
Japanese / English JavaScriptで入力補完を手軽に行うためのライブラリです。 (【お知らせ】ver2.0からprototype.jsを必要としなくなりました) 下記のような機能を持っています。 入力内容をもとに検索を行い、補完候補を表示します。(Google Suggestぽく) Ajaxでは無く、初回画面表示時のみデータの読み込みを行い、それ以降は、クライアント側で対象データから検索します。したがって、入力内容に変化があってもサーバ側にアクセスすることはありません。 検索は、前方一致/部分一致、大文字と小文字の区別あり/なしといったように、オプションで簡単に指定できます。また、その他にも様々なオプションが指定可能です。 検索結果の表示上限を指定できます。(デフォルト上限20件) 補完候補はキーボードの上下と、マウスにて選択できます。また、キーボードで選択中にES
いま,Webの世界は大きく変わろうとしています。検索エンジンはどんどん進化し,ブログやSNS(Social Networking Services)といった新しいアプリケーションが登場して,Webの用途は広がり,便利になっています。 プログラマにとってのWebの姿も大きく変わっています。従来,Webでプログラミングといえば,サーバーで動作するWeb/DBアプリケーションの構築か,JavaScriptで動的なWebページを作成することを指すのがほとんどでした。最近はこれに加えて,Web上に散在するAPI(Web API)を利用するプログラミングが流行しつつあるのです。 インターネット上のサービスを 自分のプログラムに組み込める 「API」と言えばOSの機能をプログラムから利用するための窓口というイメージがあると思います。Web APIとは,WebにおけるAPI,つまりWeb上にあるサービスを
The Detailed Description Of MochiKit JS Library And Its Function Developed by Bob Ippolito, the JavaScript Library of MochiKit has cross platform operating system with both MIT License and Academic Free License. With the stable release of the 1.4.2 version, MochiKit is a lightweight library that has taken inspiration from Python’s networking framework named Twisted. By using deferred execution con
Ajaxライブラリの全体像を把握しよう Ajaxライブラリ(*注1)はすでに数多くのものが出回っていますが、多過ぎて全体像がつかめていないのではないでしょうか。今回は代表的なAjaxライブラリの一部を挙げ、それぞれを比較しながらAjaxライブラリの全体像を把握していきたいと思います。 どうして、Webアプリ開発にAjaxライブラリが必要なのか どのようなプログラミング言語でもライブラリが存在するように、Ajaxにおいてもライブラリが存在します。 初めにAjaxライブラリの必要性について見ていきたいと思いますが、ここではAjax開発ならではのライブラリの必要性を2点取り上げます(ほかの言語のライブラリと共通する必要性はあらためて取り上げません)。 クロスブラウザ対応 Ajaxの利点として、さまざまな環境における一般的なWebブラウザ上で実行できることが挙げられます。しかしWebブラウザの実装
近年,Ajaxの台頭をきっかけに,JavaScriptを使ったブラウザのリッチ・クライアント化が進んできました。現在では,ページの表示を変化させるだけであれば,ほとんどのことはJavaScriptのみで対処することが可能です。それを実現するのがDOMなのです。 第1回 DOMから始めるモダン・スクリプティングの世界へようこそ 第2回 ブラウザからHTMLはどう見えているかを理解しよう ~ドキュメントツリー~ 第3回 DOMスクリプティングのことはじめ(1) ~要素(タグ)を狙い撃ち~ 第4回 DOMスクリプティングのことはじめ(2) ~これはどんな要素?~ 第5回 DOMを使ってHTMLを自由自在に書き換える 第6回 イベントハンドラから脱却しよう 第7回 スクリプトを完全に分離しよう ~コンテンツ,プレゼンテーション,ビヘイビア~ 第8回 スクリプトのパッケージ化 ~使い回しできるスクリ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く