AngularJS の勉強、始めました。 最初はそのプログラミングに関する独特のお約束事項にイラッとしましたが、キモであろう DI を「疎な関係のクラスを（実行時に）結びつけるのに必要な仕組み」と割り切り、DI – 猿でも分かる! Dependency Injection: 依存性の注入 で引用されている ITpro 記事 の クラス図 をコードから想像できるようになったところで、それなりに面白くなってきました。 何より「jQuery が要らなくなる！」のがとっても快感なんです （つらい時もあるけど…）。 さて今回は、jQuery まみれのページを AngularJS で書き換えた時に気付いた Ajax の動作 − 非同期通信の戻り値をいつどこで DOM に反映するか − に関する話題を書いてみます。 jQueryの場合 検索のクエリを渡すと Github のリポジトリを返す関数を例にとっ
If anything about current interaction design can be called “glamorous,” it’s creating Web applications. After all, when was the last time you heard someone rave about the interaction design of a product that wasn’t on the Web? (Okay, besides the iPod.) All the cool, innovative new projects are online. Despite this, Web interaction designers can’t help but feel a little envious of our colleagues wh
Backbone.jsやEmber.js、AngularJSなどの流行りのMVCフレームワークを用いたAjaxアプリケーションのSEOについて少ししらべてみました。SEOというかクローラー対策っぽいですが。ブログ的には始めての開発系の記事。 AjaxアプリケーションのSEO的な問題 そもそもどうしてAjaxアプリケーションがSEO的にやばいかというと、一旦空のHTMLを読み込んだあとJavaScriptを使ってクライアントサイドでコンテンツをレンダリングする仕組み上、Googleのクローラーのような特殊な環境だと内容を正常に読めないというのが現状らしい。というわけでこれを如何にして読み込ませるかが本件のゴールになります。 STEP1:Ajaxアプリであることをクローラーに伝える #!(ハッシュフラグメント)をURLにつける URLに#!(ハッシュフラグメント)が含まれているとクローラーはそ
There are several solutions depending on what you need... If you want to add a custom header (or set of headers) to an individual request then just add the headers property: // Request with custom header $.ajax({ url: 'foo/bar', headers: { 'x-my-custom-header': 'some value' } }); If you want to add a default header (or set of headers) to every request then use $.ajaxSetup(): $.ajaxSetup({ headers:
目次 jQuery 1.4以前の書き方jQuery 1.5以上の書き方jQuery 1.8以上の書き方【発展編1】Deferredを用いた書き方 deferredとは何か？【発展編2】$.when() を用いた書き方参考本エントリは軽めのjQuery Advent Calendar 2012の14日目の記事として書きます。軽めといいながら少し重めになってしまった感がありますが、初めてのAdvent Calendar参加ということでご勘弁を。 ※ Twitter API仕様変更によりTwitter APIを使ったコード例は現在動作しなくなっていることにご注意。 jQuery 1.4以前の書き方まずは、少し古めのコード、昔のjQueryの本とかでよく見る書き方。 $.ajax({ url: "ajax.html", success: function(data) { alert('succes
今さら感はありますが、Rails3 の Ajax 実装の方法を紹介します。 Rails3.1 から jQuery がデフォルトになり、AjaxもRails2の頃とは違うスタイルなりました。また、幾つかのパターンが選べるようになりました。 ここでは上の画像のように、 rails g scaffold todo due:date task:string で作ったアプリのshow がindex画面に表示される簡単な Ajax アプリで説明します。 1. Rails2 に近いやり方 Rails2 では、view にjavascriptを書かずに ajax アプリを書けるようになっていましたが、それに近い方法は、 index.html.erb の showへのリンクに :remote => trueを指定し、Ajax用の表示エリア div.show_area を置きます。 <% @todos.eac
Also see Rails 3 Remote Links and Forms Part 2: Data-type (with jQuery). Spoiler Alert: If you like magic, stop reading. The Rails 3 UJS driver (rails.js), which powers the remote links, forms, and inputs, is not very magical when you know how it works. This article uses the jQuery UJS driver, though the Prototype UJS driver does the same thing. UJS, by the way, stands for "Unobtrusive JavaScript"
Overview The jQuery Form Plugin allows you to easily and unobtrusively upgrade HTML forms to use AJAX. The main methods, ajaxForm and ajaxSubmit, gather information from the form element to determine how to manage the submit process. Both of these methods support numerous options which allows you to have full control over how the data is submitted. Submitting a form with AJAX doesn't get any easie
一番シンプルっぽいパターンをメモ。とりあえず Ajax通信できた、というレベル。 通常の Ajax通信ではコールバックを html か js ファイルに書くと思っていたが、Rails3ではコントローラ側で js を生成してレスポンスを返すイメージらしい。 index.html.erb @tunes.each のループの中で form_for を使用しており、第一引数に tuneオブジェクトを設定している Ajax なので :remote => true とする フォームは簡単にテキストフィールドのみ。初期値を設定しつつ、リターンで変更後の値を Ajax通信として送信する レスポンスを "result" のタグに差し込む <div id="result"></div> <table class="tunes"> <% @tunes.each do |tune| %> <tr> <td><%=
jQuery のソースから拾ってきたネタなんすが、arguments.callee と setTimeout を使ったリトライ処理が超便利なのでご紹介。 まず基本形はこんな感じす。 (function() { // なんか処理 if (error) { setTimeout(arguments.callee, 20); } })(); 上のコードは error が真のとき20マイクロ秒後に無名関数の実行をリトライします。20マイクロ秒だとリトライ間隔が短いような気がするかもしれませんが、リトライ回数は1秒に50回ですので言うほどでもないです。 arguments.callee は関数内でのみ参照可能で、実行中の関数自身への参照を保持します。上の例では arguments.callee は無名関数への参照となります。setTimeout に arguments.callee を渡すその関数を
もう、通常のJavascriptでAjaxする方法は忘れてしまいましたが、 エラーやタイムアウトなどを受けてAjax通信を中断するには、 xhr.abort(); // xhrはXMLHttpオブジェクトを格納している のように、"abort()"メソッドを使うようです。 jQueryでも上記の"abort()"が使えますが、どうやらXMLHttpオブジェクトを 『$()』で囲んでjQueryオブジェクトにしなくてはならないようです。 【訂正:2012年2月13日】 jQueryでも同じでした orz 逆に、jQueryオブジェクトのメソッドとしてabortを呼び出そうとすると失敗します。 (jQuery 1.3.1、1.7.1 で確認しました。) jQuery: // 失敗 var xhr = $.get("test.php"); $(xhr).abort(); // 成功 var xh
New: Added new fonts to generate more creative buttons and badges! More to come... Chimply is a website to easily generate loading image indicators, buttons and badges. You can also manipulate images by resizing and cropping them with the image editor. Create professional images with Chimply. It's easy and free!
Share it! If checked, the option values will be stored in the URL so that you can easily share your settings. Features No images No dependencies Highly configurable Resolution independent Uses CSS keyframe animations Works in all major browsers Includes TypeScript definitions Distributed as a native ECMAScript module MIT License Spin.js dynamically creates spinning activity indicators that can be
コンテンツへスキップ 無料で使える！HubSpotの顧客リストの活用法 無料のアンケート作成ツール 比較／まとめ 無料「Excel」 テンプレート 比較／まとめ 無料で使えるノートアプリ比較 (Evernote / OneNote / Google Keep) おすすめの無料Web会議システム5選 WebP Converter 徹底解説！初心者でも直ぐに使える HubSpot は、マーケティング、セールス、サービスのためのCRM（Continue reading 多くの人の声を聞くことで改善できることも多い 企業や団体など運営していContinue reading 就職・転職には必須となる履歴書・職務経歴書 これから就職活動をスタートContinue reading 便利なノートアプリで効率的な仕事をしよう いつの時代も仕事をしていてメContinue reading 近年、リモートワーク
ポチってもうたー開発メモ。 UIだけJSでいじってる時はそこまで慎重になることでもないけども、頻繁にガシガシajaxする場合は、既に走っているajaxリクエストもうまいことハンドリングすべき。ポチってもうたーでは、ツイートをJSONで返すよう、サーバーサイドでサービスを用意しているわけだけれども、まぁ、普通に考えれば、こんな感じで、JSON返ってきたらUIを更新するってやるんじゃないだろーか。 $.ajax(url, query).then(function(){ // UI更新しちゃう }, function(){ alert('ゴメンなんか変'); }); しかし、これには問題があって、JSONが返ってくる前に、もうそのUIが用済みになってしまうような操作がされた場合、あーもうUI更新して欲しくないんだけど後から更新されちゃったよーっていうことになってしまう。 ポチってもうたーでは、ロ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
