There are many functionalities on the web that were just begging to be AJAXified. Whether it be voting on a poll or simply commenting on a blog post, there's really no reason to reload an entire page for something so simple. This blog has featured AJAX comments in WordPress for years, but only recently did I find the most optimized way to process those comments. Here's how to handle the WordPre
Download and extract the jQuery Fileuploader Plugin: https://github.com/johnlanz/jquery-fileuploader Load CSS and Javascript: <link href="css/ui-lightness/jquery-ui-1.8.14.custom.css" rel="stylesheet" type="text/css" /> <link href="css/fileUploader.css" rel="stylesheet" type="text/css" /> <script src="js/jquery-1.6.2.min.js" type="text/javascript"></script> <script src="js/jquery-ui-1.8.14.custom.
LINKTEXTIn this tutorial we will be making a simple app with PHP and jQuery that lets users write notes. The notes are going to be saved in plain text files on the server. It demonstrates how to read and write files in PHP, how to resize a textarea with jQuery, depending on the text inside it, and how to create a simple AJAX interaction. Grab a copy of the demo from the button above and read on! T
jQueryでのAjaxについては実案件でもポツポツ使ってましたが、Ajax呼び出し元とサーバーが同じドメインのケースばっかりで、 サーバーのドメインが異なるケースについては詳しくなかったので、再確認しました。 業務系Webシステムを作ってるとあまり使わない気がしないでも無いですが、例えば他システムのWebAPIをAjaxで呼んだりするかもしれません。 あと、PhoneGapを使う場合は必須になるのではないでしょうか。 以下、サンプルを記述しました。 サーバー側プログラムはSAStrutsですが、他言語でも内容はほとんど変わらないと思います。 同じドメインでのAjaxの例 サーバー側プログラム @Execute(validator=false) public String normalAjax() { String data = "{\"id\" : \"A001\",\"name\" :
XMLHttpRequest Level 2 に対応しているWebブラウザは、(ある条件下で)異なるドメインにAJAXリクエストを投げることが可能です。jQueryでは以下のように書けます。 $.ajax({ context: this, type: 'POST', url: 'http://www.example.com/hoge', /* 異なるドメイン */ data: something, dataType: 'json', success: function (v) { alert(v); } }); ただし、このコードは Chrome, Safari, Firefox 3.5+ でのみ動きます。IE 8+ で動かすには XMLHttpRequest の代わりに XDomainRequest を使う必要があります。jQueryは今のところ XDomainRequest に対応して
js.erbはセキュリティリスクあるから使うなという話をよく見るし、それはおおむね正しいと思うんですが、じゃあ代替としてどうするのがいいのっていうところまで示している記事とかあんまり見ないよなあと思ったので書いておきます。主に設計のお話なのでコピペに役立つコードみたいなのは出てきません。 テンプレート処理が不要なケース、たとえばレスポンスを受けてDOM内における特定の数値を書き換えるだけとかの場合は特に細かいことを気にしないでもいいはずなので明記はしません。js.erbで書いた場合にrenderによるテンプレート処理を行うであろうケースを違う手段で代替した場合、ものすごくざっくり書くとこういう感じになると思います。 必要な文字列テンプレートは出力されたHTMLにあらかじめ埋め込んでおく jquery_ujsでイベントハンドラが生えている(ajax:*)ので、それぞれコールバック処理を書いて
ディノ日本酒調達部員の sou です。こんにちは。 今日はAjax開発に便利なjQueryプラグインを紹介します。 ディノも昨年から JavaScript 案件が増えており、本格的な JavaScript アプリケーションも実装するようになってきました。ただ、サーバサイドのみの開発に比べるとXMLHttpRequest経由でサーバサイドとのつなぎ込みが発生するので、問題の切り分けや実装スケジュール調整など難しい点もあるのではないでしょうか。 そんな時には jquery.mockAjax プラグインが便利です。 概要 これを使うと $.ajax のリクエスト先を条件に従い振り分ける事が出来、スクリプトや HTML の書き換え無しにサーバ側への通信をカットし、 ローカルファイルで用意した JSON や HTML フラグメントを代わりに持ってくる事が出来ます。 小さい&単純なコードですが、こ
AjaXplorer プライベートなクラウドを実現できるPHPで書かれたファイルマネージャ「AjaXplorer」。 次のようなリッチなUIに加えて、デスクトップからファイルをドラッグ&ドロップでアップできたりする超多機能ファイルマネージャです。 更に、iPhone/Androidアプリが存在していて、そこからファイルの閲覧やアップも可能というところが凄いです iOS, Android用のそれぞれのアプリケーションもダウンロードできます DropBox等もいいのですが、外部サーバに重要なファイルを置くのが気が引けるという場合はこれを使ってみてもよいかもですね 関連エントリ WindowsのエクスプローラそっくりなWEBファイルマネージャ「FileVista」
There’s no doubt that Ajax is one of the most exciting, useful, and necessary web technologies available to front-end developers. Unfortunately, it’s also one of the most restrictive — especially when it comes to gathering content from other domains. Web developers are nothing if not persistent, so we’ve come up with a variety of ways to get around cross-origin restrictions, including JSONP, serve
問題 Reactive Extensions で非同期処理を簡潔に記述するでは「キー入力に応じて補完候補を表示する」「ただし補完候補はAjaxで非同期に取得する」という いまどきのWebアプリケーションにならあって当然の機能が、Reactive Extensions (Rx)を使うことであたかも普通のリスト処理のように記述できることを示しました。 入力補完は例としては単純で分かり易いものの、 もう少し別の例も欲しいところです。 という訳で、 Rx を使うことでコナミコマンドを実装してみましょう。 回答1: Rx を使わない場合 var lastKeyCodes = []; var validKeyCodes = [38, 38, 40, 40, 37, 39, 37, 39, 66, 65]; $(window).keydown(function (e) { lastKeyCodes.pu
問題 今時の若者ならばHeroku等を利用して手早く Web アプリを作成・公開することが日常茶飯事です。 バックエンドもフロントエンドも今はフレームワークが充実していますから、 高度な処理を簡潔な記述で行うことができます。 しかし非同期処理となると話は別です。 例えばフロントエンドを作るとなると、まずjQueryを使うことになるでしょう。 jQuery は洗練された API で DOM 操作を簡単に行うことができますし、 非同期通信についても $.ajax を使えば煩雑なことほぼ知らずに済みます。 例えばWikipediaの検索フォームは入力補完が行われるようになっており、 検索フォーム文字が入力されると関連するページのタイトルが候補として表示されます。 このような処理を書くとなると以下のようなコードになるでしょう: var showCompletionMenu = function (
I can’t seem to reach the end of the fun stuff you can do with web technologies. Today, I’m going to show you how to upload files via AJAX. First, we'll see how to upload files using vanilla JavaScript. And later on, I'll show how you could use the DropzoneJS library to implement drag-and-drop file uploads. Looking for a Quick Solution? If you're looking for a quick solution, there's a great colle
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く