くだすれAjax（超初心者用）

>>453
http://lagoscript.org/jquery/autopager

>>454
動いてた状態までリカバリすれば良いと思うよ。

教えてください。

jquery $.ajax()での通信前後(beforeSendとcomplete)に
$(".SUBMIT_LOCK").attr( "disabled", "disabled" );
$(".SUBMIT_LOCK").removeAttr( "disabled" );
でボタンを無効化したいと思っています。

Firefoxでは問題なく動作しますが、IE7ですと上記がうまく動きません。
disabledした後にalert()で処理を止めるとボタンが正常に無効化されます。

$.ajax()が呼び出された時点でアニメーションgifが止まり、ブラウザが
フリーズしたようになるので、それが原因と思うのですが、何か対策は
ないものでしょうか。

Ajaxでの画面制御について教えてください。
ブラウザの戻るボタンを意識しなくても済むように、一つのURLで検索画面→一覧画面→詳細画面→編集画面→更新確認画面→更新結果画面と画面遷移させたいと考えています。
その場合、一つのhtmlファイル（実体はjspファイルの予定）の中に、全ての画面のデザインや実装コードを記述するのは現実的ではないですよね。
この辺の画面単位のコードの切り分け、画面制御の仕組みというかセオリーがありそうだと思うのですが、Ajax関連のサイトを見てもページ単位の実装方法について書かれた物ばかりでした。
実際に開発している方のお話が聞ければ助かります。

MVCでググれ

ヒントありがとうございます！色々記事が見つかりました。

ターゲットはiOS系のSafariなんだけど-Aajaxでデータを貰う時（B→A）
BでHTML書き出してからAでinnerHTML
と
BでxmlやJSONなりを作成してAでDOM
だと、ベンチはどっちが早いの？
知ってるエロイ人がいたら教えてください(´･ω･`)
※DOMの方が早ければDOMを勉強します

http://hibari.2ch.net/test/read.cgi/php/1166751613/

MAMPでローカルにphpテスト環境を走らせています（現在勉強中の立場です）
JSONデータの扱いについて質問があります

test.jsonというファイルがあって、
たとえばJSの$.getJSON()で通信しようとするとき、拡張子が
test.jsonのままだと読み込みませんが、
test.json.phpとすると通信に成功するのはなぜでしょうか？

まったく同じセットでレンタルサーバーにアップしてテストしてみると今度は逆に
test.json.phpだと読み込みませんが、
test.jsonとすると通信に成功します。

いたらないことばかりですがご教示いただけますでしょうか。
自分としてはどちらでも同じ拡張子でテストができるといいのですが。

http鯖の設定を見直せ

ｗ

面倒なら拡張子を .txtにしたらは？

ajaxでフォームの内容送信する時、無効な文字の除去とかチェックってどこまでするのが一般的ですか？
例えば掲示板のテキストエリアとかを送信する場合、制御コードとか表示されない文字コードとか除去してから送信するもんですかね？
サーバー側で除去するのは前提としてです。

>>467

送信する内容と回線の太さ、サーバの処理能力によると思う。
特に送る内容もたいした量じゃなく、サーバの処理能力も十分高ければ、
サーバ側でバリデーション処理しても問題ない。

クライアント側でバリデーション処理するのは、回線にもサーバにもやさしいけれど、
JSオフの環境だと使えないので、代替処理の方法（やっぱサーバ側で）を同時に実装しないとユーザビリティ的にうるさいクラでは駄目（仕事レベルでは）。

趣味ならすきにして...

>> 468
ありがとうございます！
送る量もたいしたことなく、サーバー処理能力も十分と思います。
ユーザビリティ的な意味でのバリデーションはjs側で行います。
プラス脆弱性対策として危険なデータをjsでも除去するかどうかというところを悩んでいます。
言葉足らずで申し訳ありません。

勇気をもって書き込みます。ajaxって何ですか？

高度な質問だな
ググってすぐ分かるような意味でのajaxを訊いているわけではなかろう

確かに！
クラの中にはJavaScriptでWeb画面に変化を与えることをAjexだと思っている勘違いも居るし...

その前にクラって何だ？

クライアントじゃね？
あと、細かいけどAjaxな

>>474
ぜんぜん細かくない事だよなそれ

っっw

っっｗ

って、草むらに飛んでいく精子に見えるよな

精子は肉眼じゃ見えないよ

最近気づいたんだけど、google検索のページングがajaxになってたんだな。
ヒストリーバックしてもリクエスト走らないし、完全に通常の画面遷移と同じ感じで操作できるわ。
ああいうの自分のサイトにも入れたい。

jquery+perl+htmlでツール作ってるけど、どう切り分けるのがいいんだろうか？
3つのファイルを行き来するのは面倒で、
HTMLはほぼbodyだけでJS+perlのみにしたほうがいいのかな？

>>470
俺が答えてあげよう。
それは私たちに残された希望の1つと同時に絶望でもある。
一度手を出すとクロスブラウザ対策などいくつもの地獄を見ることになる。
しかし、それを克服したときかつて見たことのないような世界にたどり着くだろう。
恐れることはない。ただ前へ進め。時間と覚悟をもって旅立て！

$.ajax({
url: 'hogehoge.php',
type: 'POST',
data: 'hogeId=abc',
timeout: 30000,
error: function(xhr, ajaxOptions, thrownError){ },
success: function(xml){ }
});
といったかんじでPOSTした後、
エラー処理内でPOST時のデータ（hogeId）を参照することはできないでしょうか？

サーバからエラーコードを返すケースであればレスポンスで渡せるかと思いますが、
例えばタイムアウトとなった場合やProxy等でエラーが返された場合に、
どのように取得したらよいか・・・

すみません、JavaScriptの質問スレで質問しなおしました。

オールAjaxのページを作りたいのですがナビゲーションクリック時どうすればいいでしょうか
メインコンテンツを表示する部分をいくつも作り最初に読み込ませておくのか、一つで頑張ってその都度読み込ませるのかで迷ってます

分かる人がいれば教えてくだちい。

Google+の「+1」の数だけ取得したくて、以下のようなコードを書いてみました。

　$.ajax({
　　type　　 : 'get',
　　url　　　: 'https://plusone.google.com/u/0/_/+1/fastbutton?url=' + targetURL,
　　dataType : 'jsonp',
　　success: function( data, textStatus ) {
　　　//読み込み成功
　　},
　　error: function( XMLHttpRequest, textStatus, errorThrown ) {
　　　//読み込み失敗
　　}
　});

で、実行させると、必ず失敗するんですが、Firebug(1.9.1)でチェックすると、レスポンスの欄には、ちゃんと目的のHTMLが届いています。
いろいろ試して、dataType : 'script'では成功となりますが、レスポンスには、そのまんま何らかの関数のコードが届いていました。

どうすれば、Google+の「+1」の数だけ取得できるでしょうか？！

過疎化したスレに書き込んでしまいましたので、こちらでお尋ねしたいと思います。
分かる人がいれば教えてくだちい。

Google+の「+1」の数だけ取得したくて、以下のようなコードを書いてみました。

　$.ajax({
　　type　　 : 'get',
　　url　　　: 'https://plusone.google.com/u/0/_/+1/fastbutton?url=' + targetURL,
　　dataType : 'jsonp',
　　success: function( data, textStatus ) {
　　　//読み込み成功
　　},
　　error: function( XMLHttpRequest, textStatus, errorThrown ) {
　　　//読み込み失敗
　　}
　});

で、実行させると、必ず失敗するんですが、Firebug(1.9.1)でチェックすると、レスポンスの欄には、ちゃんと目的のHTMLが届いていました。
いろいろ試してみると、dataType : 'script'では成功しますが、レスポンスには何らかの関数のコードが届いていました。

どうすれば、Google+の「+1」の数だけ取得できるでしょうか？！
FacebookやTwitterみたいには行かないんですかね？！
（Ajax以外の方法でも構いません）

ものすごい初歩的な質問なんだけど
JavascriptとAjaxの違いって、

Ajax　　　　　　　　　　　　　　　Javascript
・.xml使える　　　　　　　　　　.・.xml使えない
・ページ遷移なしで使える　　・ページ遷移しないと動作しない

これだけでしょうか？

ものすごく噛み砕いて言うと、javascript+ネット通信(xmlHttpRequest)=ajax
だから違いというよりも（別言語ということでなく）、javascriptの部分的な拡張がajaxになる
違ってたら他の詳しい人よろしく

拡張というのにちょっと違和感が　JavaScriptの「一部」じゃない？
JavaScriptができることの一部分に名前付けちゃっただけ

こういう質問が出てくる（稀によく見る）くらいだし、
ぶっちゃけAjaxと名付けたのは失敗だと思う　言葉の一人歩き

上レスの言う通り。

ただ、>>487の区分けは間違っている
なぜなら、AjaxはJavaScriptから成り立っているから。
なので、AjaxのできることはJavaScriptでもできる。

創価死ね
創価死ね
創価死ね
創価死ね　
創価死ね　
創価死ね
創価死ね
創価死ね
創価死ね
創価死ね
創価死ね
創価死ね
創価死ね　
創価死ね
創価死ね
創価死ね
創価死ね
創価死ね
創価死ね

ある既存の投稿画面に別のURLから投稿し、その後同じ画面(actionのURLにジャンプしない)の
ままでいられるようにするには、どのようにしたらよいでしょうか？

例）
http://example.com/index.phpに下記のフォームがあった場合、「書き込み」ボタンを
押すとhttp://example.com/write.cgiが実行され、http://example.com/write.cgi
にジャンプしてしまいますが、
ジャンプせずhttp://example.com/index.phpの画面のまま次の処理を待ちたいです。

<form method="POST" action="http://example.com/write.cgi' name="fuga">
<input type="hidden" name="BBS" value="hogehoge">
<input type="hidden" name="KEY" value="hogehoge">
<input type="submit" name="WRITE" value="書き込み">
名前 <input type="text" name="NAME" size="20">
E-mail： <input type="text" name="MAIL" size="20">
</form>

>>492
人によってやり方が違うと思うから「俺の場合はこうやる」と前置きしておいて
1) submitボタンで行われるサーバリクエストをJavaScriptでキャンセルしておく
2) submitボタン押下時のイベントをJavaScriptで仕込む
　　送信するデータを整えて、CGIにAjaxで投げる
3) 帰ってきたデータを解析してページ内に反映させる

やることはAjax通信の基礎なので、その辺りはググるとよし
とりあえず流れだけは書いておいた

PHPで自分のサーバに掲示板を作ってます。
そこにはスレッド一覧があるのですが、掲示板に書き込みがあった際に
Ajaxで新着件数を表示させるように出来ますか？


具体的な機能のイメージは、
２ちゃんのスレッド一覧(http://toro.2ch.net/hp/subback.html)で、最初読み込んだ時に
次のスレのレス数が495あったとします。

「くだすれAjax（超初心者用） (495)」

2時間後、スレッド一覧をアクセスしたら、レス数が501に増えてました。
この時、

「くだすれAjax（超初心者用） (495)　←NEW6件」

と言うような表示をしたいのです。

これが出来るかすら分からないので、とりあえず質問してみました。
サンプルなどがあったら嬉しいです。

恐らく専ブラで「新着○件」と出るからブラウザでもそれやりたいって話と思うが、普通はクッキー使うからAjax関係ない
クッキーに既読件数を保存するやり方だから、ユーザがクッキーを削除したらデータ消えるし、クッキー拒否設定なら全く使えない
特定のユーザとしてログインする方法ならAjaxでサーバに保存することもできるけど、ログイン型掲示板なんて相当クローズドだし微妙

>2時間後、スレッド一覧をアクセス
というのは一度ウィンドウやタブを閉じてという話と思うが、開きっぱなしにしていて、かつ新着を取得するというならAjaxの領域だな
Twitter公式ページの「○件の新しいツイート」というのがこれに当たる
一定時間ごとにサーバにアクセスして、更新があればその都度書き換える具合

>>495
なるほど、ありがとうございます！

＞開きっぱなしにしていて、かつ新着を取得するというならAjax
サンプル付きの解説とか、お勧めありますか？
検索したのですが、初心者によさげなのが無いんですよね・・・
本でも買った方がいいんでしょうかね。。

>>496
本は印刷などの工程を踏むため情報は必ず最新でないから、ネットで調べる癖を付けた方がいい
ソースなんてあちこちに公開されてるし、実際使われてる例を参考にする方がよっぽど身になる
検索スキルは習得しておいて損はない

jQueryを利用したAjaxが比較的理解しやすいと思うのでこの辺りを張っておく
　ttp://jquery.keicode.com/basics/ajax.php
そもそもjQueryすらわからん場合はこの辺り
　ttp://www.atmarkit.co.jp/fwcr/rensai2/jquery02/01.html
JavaScriptすら怪しいレベルならここかな
　ttp://www.amazon.co.jp/s/field-keywords=javascript

>>497
ありがとうございます！！

いきなりですいませんが・・・
AjaxやjQueryやJavaScriptを操れるようになって仕事探したいんですけど。
あるいはなんかWEBサービス自分でつくったりも。。。

AjaxやjQueryやJavaScriptの技術をつけるにおいて
XMLって勉強したほうがいいんでしょうか？あとDOM？とか。

なんかイメージをつかめきれなくて。。。

>>499

JavaScriptを主軸に勉強する。
【内容】
・JavaScriptを使ってDOMを操作する（画像のロールオーバーなんか目をつむっていても書けるようにしておく）。
・JavaScriptで非同期通信ができるようになる（ブラウザ毎の書き方の違いを居眠りしていても分かるようにする）。
・上に関連して、読み書きするデータ形式としてXML、JSON、JSONPの違いと形式を理解しておく（上の勉強と一緒にできる）。
・入力フォームのサニタイズ（入力チェック）ライブラリをJavaScriptで作っておく（不正な形式のメールアドレスなども検知できるように）。

上が出来るようになってから、jQueryを学ぶ。

簡単なHTMLは、ノートパットでも書けるようにしておく。
その上でHTML5を勉強。

更に理解しておく用語として、
・バリデーション
・セマンティックWEB
・プログレッシブエンハンスメント

その先にこれか必要になる技として『レスポンシブWEBデザイン』がある。
PCページしか作らないページであっても、
メディアクエリを設定しておかないと、スマフォでそのPCページを観た時に、
レイアウトが崩れるスマフォの機種がある（ドコモのディズニーフォンとか...）。
なので、レスポンシブWEBデザイン』は必須である。

無理に頑張らなくていい、才能出してくれれば...

あれやこれや手を付けず、焦らず無理に頑張りすぎないことは確かに重要だな
JavaScriptの技術を付けるって言ってる位だから、「今から」の人なんだろう

499です、どうもです。コメントありがとうございます。

ある程度はWEBに理解があるつもりですが、
やっぱりあれこれやらずにコツコツとやっていきます。

https://twitter.com/kai_ri_no/status/557402636253544448
こんな風に head要素の下に script要素を追加して通信してるのだけど、
サーバーの応答は、どうすれば見えるの？
head.insertBefore( script, head.firstChild );

dsniff などの盗聴ソフトで見れないの？