Ajax的に画像などのファイルをアップロードする方法 ::ハブろぐ
a-blog cmsの開発中、Ajax的にファイルをアップロードする必要があったので、その際の調べ物についてかきます。普通にpostしようにも、JavaScriptでローカルのファイルは扱えないよ、って話で、先輩から「iframeがヒントだ！」的なざっくりとしたアドバイスを頂いたので、それを頼りに調べる。 画面遷移なしでファイルアップロードする方法 - 30からのBlog おお、なるほどなるほど。以下、HTML, JavaScript, PHPのサンプルをメモ。 こんなHTMLをJavaScriptで操作すればいい JavaScript自身が要素の生成を作成してもよいですが、最終的にはこういうHTMLが作成されることになります。 <a href="#" id="uploadTrigger">アップロードするぜー</a> <form id="uploadForm" action="画像POS
How to manage a redirect request after a jQuery Ajax call
I'm using $.post() to call a servlet using Ajax and then using the resulting HTML fragment to replace a div element in the user's current page. However, if the session times out, the server sends a redirect directive to send the user to the login page. In this case, jQuery is replacing the div element with the contents of the login page, forcing the user's eyes to witness a rare scene indeed. How
［さらに気になる］JSONの守り方
XSSにCSRFにSQLインジェクションにディレクトリトラバーサル……Webアプリケーションのプログラマが知っておくべき脆弱性はいっぱいあります。そこで本連載では、そのようなメジャーなもの“以外”も掘り下げていきます （編集部） 次は、JSONにおけるセキュリティ対策 皆さんこんにちは、はせがわようすけです。第4回「［気になる］JSONPの守り方」はJSONPについて説明しましたので、今回は「JSON」についてもセキュリティ上注意すべき点について説明します。 JSONは、XMLHttpRequestで受け取り、JavaScript上でevalするという使い方が一般的です。 まずはサーバ側から送られる情報と、クライアント側での処理、それぞれの内容を見ておきましょう。 ［サーバ側］ HTTP/1.1 200 OK Content-Type: application/json; charset=
ハイテンションAjax入門 - 三等兵
JSが少しできる人ならうじうじ考えるほどのこともでもない！ 何も難しいことはない！ぶっとんぢまいなよ！ヒャッパー！！！ というノリでAjaxを学んでみました。醜いです。 Ajax入門 Ajaxはいろいろできるんだぜ！ 以上入門終り！キミは完璧だ！次いけ！ Ajaxは非同期通信だかなんだかそんなもんはどうでもいいんだ！ どうでもいい！そんなことよりもXMLHttpRequestオブジェクト生成！ var request = false; if(window.XMLHttpRequest) { request = new XMLHttpRequest(); //frefox ie7,8 safai opera } else if(window.ActiveXObject) { try { request = new ActiveXObject("Msxml2.XMLHTTP"); // ie6
マウスの軌跡をJavaScriptとPHPで記録し再生するサンプル:phpspot開発日誌
puRe aka Marcel Oelke Record mouse movement using Javascript and AJAX マウスの軌跡をJavaScriptとPHPで記録し再生するサンプル。 mousemove イベントハンドラの発生ごとに、Ajax で座標をサーバ側に送信し、PHPでデータを保持する仕組みで実装されているようです。 クリックイベントも取って再生することも出来るみたいです。 prototype.js ベースで、実装されているみたいですが、応用して、サイト利用者のサイトの利用法について調査することなどが可能になりますね。 実際の動作デモはこちら
jQuery UIで実現！ Ajaxで複数選択ドラッグ＆ドロップ
jQuery、プラグイン、jQuery UI、Web経由のCDNとは CSSの書き方も分かるjQueryプラグイン実践活用法（1） 基本／おさらいとしてプラグインやjQuery UIについて簡単に触れ、Web経由でjQueryを使うCDNについて解説 デザインハック ＜ リッチクライアント 2009/12/8 今回は「jQuery UI」のより進んだ活用例 ■ jQueryのプラグイン「jQuery UI」とは？ 今回紹介するjQuery UIは、JavaScript（Ajax）フレームワークjQueryのプロジェクトがjQuery用に開発している、以下の機能を提供するプラグインです。 ドラッグ＆ドロップなどのマウス操作の機能拡張 ユーザーインターフェイスを改善するウィジェット（アコーディオン、日付入力、ダイアログ、スライダー、タブなど） 今回は、jQuery UIのドラッグ＆ドロップ機能
[ThinkIT] 第5回：Ajaxアプリケーションの作成 (1/4)
今回はRuby on Rails（以下、Rails）を用いてAjaxアプリケーションを作成します。まずはAjaxについて、簡単におさらいしましょう。 ご存知の通りここ1年余りAjaxは多くのメディアで取り上げられ、注目が集まっています。Ajaxは「Asynchronous JavaScript + XML」の略称で、その名の通りXMLとJavaScriptを用いた非同期通信技術のことです。 Ajaxを用いることでサーバアクセスをバックグラウンド化することができ、シングルページでアプリケーションを作成することができます。「サーバアクセス＝画面全体更新」であった従来のWebシステムに比べて、効率的でユーザビリティの高いシステムを実現する手法として注目されています。 また現在ではXMLの利用や通信の発生がなくても、JavaScriptを用いてリッチなUIを実現していればAjaxと呼ばれるようにな
AJAXのサンプルが山ほどダウンロードできるサイト「Ajax Rain」 - GIGAZINE
jQuery、ProtoType、.Netなどのフレームワークを使ったサンプル、デモが豊富にあります。しかも、サンプルをダウンロード可能。サンプルやデモを見ているだけでも、インスピレーションが沸いてきます。 詳細は、以下から。AjaxRain かなりのサンプル数があるので探していた物を見つけることができるかも。タグで分別されているので、探すのは意外と簡単にできそうです。ちなみにサンプルの1ページあたりの表示数を変更できるのですが、100以上を入れると100にされます。 毎月このサイトでAJAXなどを使ったコードのコンテストをしているので、腕に自信のある方は応募してみては。詳しくはこちらから。 AjaxRain.com Rain Fest
知っておいて損はないAJAXやCSSを駆使したタブインターフェース18種類 - GIGAZINE
技術的知識が無くてもタブを作れるフリーソフトからかなり派手な効果を伴うタブ作成ライブラリ、Yahoo！やGoogle、Adobeの作ったタブまで、いろいろと応用が利いて独自の特徴があるものをざっくりと18種類ほどピックアップしてみました。 いろいろなページやブログで頻繁に見かけるタブ方式のメニューですが、こうやって並べてみると実は見せ方も使い方も種々様々であることがよくわかります。 まずは知識不要でタブが簡単に作成できる「CSS Tab Designer」。Windows用のフリーソフトで、約60種類ものデザインが用意されています。その中にタブ方式のメニューもたくさん用意されており、ほかにも縦型のメニューやZDNet風メニューなども用意されています。 OverZone Software - CSS Tab Designer 細かいカスタマイズが可能なタブメニュー。画像を使ったサンプルも用意
JavaScriptレスでAjax開発、NTTデータ新フレームワークの実力は － ＠IT
2006/10/7 「Ajaxやリッチクライアントのフレームワークでデファクトは、ない。そこを狙いたい」。NTTデータは9月20日、Ajaxベースのリッチクライアント開発フレームワーク「マスカット」をオープンソースソフトウェアとして公開した。プロジェクトを主導するNTTデータの技術開発本部 ソフトウェア工学推進センタ シニアエキスパート 木村利幸氏はOSS化の狙いをこう語る。 マスカットは、JavaScriptを書かずにGUIベースでAjaxアプリケーションを開発できるフレームワーク。「prototype.js」「script.aculo.us」などのAjaxフレームワークが、ライブラリを使ったJavaScript開発支援機能を提供するのに対して、マスカットはXMLデータを活用することで、JavaScriptをコーディングすることなく、Ajaxアプリケーションを開発できる。3階層型Webア
ITmedia エンタープライズ：Ajaxで変わる“新”ユーザー体験 (1/3)
Web2.0を支えるテクノロジーの一つ「Ajax」。聞いたことはあるけれど、どんなものか分からない。そんな疑問に答えよう。 Webにおける新たなテクノロジーやサービスを総称する「Web 2.0」。そのなかでも、JavaScriptを用いてリッチなユーザーインタフェースを提供する「Ajax」は、Webアプリケーションの作り方を変える技術の一つだ。 Ajaxの仕組みそのものは、それほど複雑ではない。しかし細かい処理をするためには、膨大なJavaScriptのコードが必要となる。そこでAjaxアプリケーションを作る場合には、Ajaxのクラスライブラリを使うのが一般的となっている。 このオンライン・ムックPlus「Web2.0で変わるWebプログラミングの常識」では、Ajaxの基本から各種クラスライブラリを使った次世代Webアプリケーションをどのように開発すればよいのか、解説していく。 Ajaxを
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Loading...
画面遷移なしのAjaxでファイルアップロードするjQueryプラグイン10:phpspot開発日誌
jQueryでweb制作をする時にキープしておきたい30リストまとめ*ホームページを作る人のネタ帳