Ajaxでも語りませんか Rigel4
■ このスレッドは過去ログ倉庫に格納されています
0001nobodyさん
2006/12/22(金) 10:40:13ID:Tqrhab4v↓
Google Maps
↓
もう Ajax って呼んじゃおうぜ
adaptive path ≫ ajax: a new approach to web applications
ttp://www.adaptivepath.com/publications/essays/archives/000385.php
邦訳
ttp://antipop.zapto.org/docs/translations/ajax.html
AJAX - MDC
ttp://developer.mozilla.org/en/docs/AJAX
作って理解するAjax (1):IT Pro
ttp://itpro.nikkeibp.co.jp/article/COLUMN/20051104/224040/
作って理解するAjax (2):IT Pro
ttp://itpro.nikkeibp.co.jp/article/COLUMN/20051125/225193/
過去スレ
1 http://pc8.2ch.net/test/read.cgi/php/1110287963/
2 http://pc8.2ch.net/test/read.cgi/php/1134214341/
3 http://pc8.2ch.net/test/read.cgi/php/1147750917/
0721nobodyさん
2009/02/07(土) 11:19:26ID:???もうわからないからやめちまえよ
0722nobodyさん
2009/02/10(火) 02:35:03ID:???ajaxを学びたいです。ただJavaScriptは分からないので今から一緒に学びたいと思います。
ただ、XMLhttpRequestのオブジェクト生成云々でブラウザによって挙動が違うというのが
めんどくさいので、はなからprototype.jsやjQueryを使ったものを作りたいと思います。
そういったものを学ぶのにいいサイトや書籍はありませんでしょうか?
0723nobodyさん
2009/02/10(火) 05:48:23ID:???0724nobodyさん
2009/02/10(火) 23:12:32ID:???本当にPHPで一通りのことができるくらいのスキルあるなら難しい事もないっしょ
どっちも簡単だし
0725nobodyさん
2009/02/11(水) 15:55:20ID:???俺でもわかったんだから
0726nobodyさん
2009/02/11(水) 19:04:20ID:???賢いお前と一緒にするな
0727nobodyさん
2009/02/13(金) 00:36:13ID:???0728nobodyさん
2009/02/16(月) 23:47:53ID:???$("#id").defaultVal()
みたいなの出来ないの?
0730nobodyさん
2009/02/17(火) 00:40:56ID:???失礼しました。
if(this.value == this.defaultValue){
処理
}
↑これを↓みたいにしたいんです
if($("#id").val() == $("#id").defaultVal()){
処理
}
0731nobodyさん
2009/02/17(火) 01:01:59ID:???0732nobodyさん
2009/02/17(火) 11:19:14ID:???なんだろう。一生懸命説明してくれようとしてることは伝わるんだけど、
何でそれをやりたいかが全く見えてこないな。
上の書き方だと嫌な理由とか下の書き方だとメリットがあるだとかを書かないと。
0733nobodyさん
2009/02/17(火) 12:36:33ID:???入力フォームに入力されているカレントな値と
入力フォームにデフォルトで設定されていた値が同じ時に
何か実行したいの?
0735nobodyさん
2009/02/21(土) 01:34:06ID:???open("GET", "test.txt",false);
という風にしたときに、
onreadystatechangeで指定した処理に入ってこないんですけど、
send(null)したあとに、
readyStateとかstatusとか判別せずに、
そのままresponseTextの値とか使えってことですか?
0736nobodyさん
2009/02/22(日) 01:04:45ID:???日記ボタンがクリックされたらブラウザのアドレス欄が
http://xxx.yyy.zzz/foo.php?act=bar
みたいな感じになるようにしたいんですけども。
0737nobodyさん
2009/02/22(日) 02:10:11ID:???0738nobodyさん
2009/02/22(日) 02:14:22ID:???たとえば、今見てるページの情報をGETで仕込んでおいて
どっかにURL張られたりしてもそのページを表示できるようにしたいんです。
GETで仕込んでおかないとアクセスがある度に
トップページを表示することになっちゃうじゃないですか。
0739nobodyさん
2009/02/22(日) 02:24:54ID:???0740nobodyさん
2009/02/22(日) 02:36:30ID:???なるほど!それは思いつきませんでした。
たしかにそういうリンク置いてありますね。
ありがとうございます!
ページ遷移させないってのは存外に難しいもんですねぇ
0741nobodyさん
2009/02/24(火) 06:32:07ID:???あるタブ内に入力フォームが存在する時、タブを切り替えたタイミングで
そのフォームをサブミットしてDBに情報を登録、
次のタブを表示することって可能でしょうか?
0742nobodyさん
2009/02/24(火) 14:33:15ID:???0743nobodyさん
2009/02/24(火) 19:41:13ID:???タブを切り替えるって処理のときにフォーム値をDBに保存すればいいだけじゃん
本気で>>742の疑問に答えてほしいw
なんで可能か不可能かを聞いたのか、純粋に疑問
0744nobodyさん
2009/02/24(火) 21:48:24ID:???scriptからtoggleのアクションを一回発動させるなんてことは可能でしょうか?
$('#hoge').toggle(A,B)でclickされたときの処理を二つ書いているとして、
それぞれのfunctionの中でCoolieに「Aしたよ」「Bしたよ」という情報を書き込みます。
で、次回ブラウザ更新時などに、Cookieの状態をみて、
Aだった場合は、一度クリックしたという動作をさせたいんですが、
どのようにすればよいかわかりません。
単にCookieを見て、Aと同じ処理をすれば見た目上はうまくいくんですが、
この場合、toggleをクリックしても1回目は反応しません。
(Aを二度実行したことになるようで)2回目クリックして初めてtoggleがききます。
何か方法があればご教授ください。
0745nobodyさん
2009/02/25(水) 01:13:33ID:???0746nobodyさん
2009/02/25(水) 20:21:38ID:???コードを直接弄れるんだからわざわざユーザ操作と同じようにして実行させる意味ないじゃん
クッキーに情報があったらA処理をすれば見た目がうまく行くけど
状態が変更してないから一回目の処理が実行されないのが問題だっていうのなら
A処理とあわせて、クリック後の状態が初期状態になるような処理も
あわせて用意すればいいだけじゃないの
ところで、toggleの引数って
> toggle(switch)
> toggle(speed, [callback])
どっちかじゃないの?
AB二つってのはCallback関数を2つ指定すんの?
0747nobodyさん
2009/02/25(水) 20:28:33ID:???下5行はわすれてください
まぁ、まずはじめにクッキーの状態をみてから
要素にtoggleを追加すればいいだけだと思うよ
AB2つしかないなら、Aが終わってるなら $(#hoge).toggle(B,A)として、
それ以外なら $(#hoge).toggle(A,B) とすりゃいい
0748nobodyさん
2009/02/27(金) 21:49:23ID:???$(document).ready(function() {
$("#hoge").tablesorter({
headers: {
1: { sorter: "digit" }
}
});
});
<table id="hoge" class="tablesorter">
<thead>
<tr><th>都道府県</th><th>人口</th></tr>
</thead>
<tbody>
<tr><td>東京</td><td>12,570,904</td></tr>
<tr><td>神奈川</td><td>8,790,900</td></tr>
<tr><td>埼玉</td><td>7,053,689</td></tr>
<tr><td>山梨</td><td>884,531</td></tr>
</tbody>
</table>
人口でソートしようとすると、「,」が有るとそこまでの数値でソートされてしまいます。
山梨 >東京 > 神奈川 > 埼玉 という順番で。
良い方法ないでしょうか?
0749748
2009/02/27(金) 23:05:45ID:???jquery.tablesorter.js(2.0.3)の660行目を
var i = parseFloat(s);
↓
var i = parseFloat(s.replace(/,/g,''));
0750nobodyさん
2009/03/01(日) 01:22:02ID:???XMLファイルから読み込んだデータを元にして、
jQuery UIのaccordionを動的に生成するにはどうすればいいのでしょうか。
自分で書いてみましたが、動的に生成したaccordionはうまく動作しませんでした。
webブラウザはFirefox3です。
ttp://sageuploader.if.land.to/cgi-bin/1upload/src/sage1_9027.zip.html
0751nobodyさん
2009/03/01(日) 02:19:03ID:???0752nobodyさん
2009/03/01(日) 04:39:04ID:???$('img').loadがIEで作動しません。
調べたところ
http://groups.google.com/group/jquery-dev/browse_thread/thread/24b107e84adeaaee/f82dafb4b1e9ba5d?lnk=raot
こういうページは見つけたんですが英語がわからず。
このページで出てくる
$('<img/>').bind('load readystatechange', function(){
if (this.complete)
alert('loaded');
}).attr('src',...).appendTo('body');
これでも動かず。
アドバイスいただけますでしょうか?
0753752
2009/03/01(日) 04:46:10ID:???↓で何とか期待通りの動作はできました。
何か微妙ですんで、もっといい方法がありましたらお教えください。
window.setTimeout(
function(){
$('img').each(function(){
if ($(this).width()) {
alert('loaded');
}
});
}
,100
);
0754752
2009/03/01(日) 04:48:50ID:???clearTimeout()してないので、これは追加します。
0755nobodyさん
2009/03/07(土) 20:28:28ID:???JScript側でなんとかするしかないんかねこれ
0757nobodyさん
2009/03/08(日) 05:43:59ID:???まずは取得したのをtextでtextareaに吐いたりAlertに吐いたりして
正しい値が取得できてんのか確認するところからだな
0758nobodyさん
2009/03/24(火) 16:03:44ID:???DOMがロードされてから実行するんだ。
$(document).ready(function(){
処理
});
0759nobodyさん
2009/04/02(木) 18:12:24ID:???マウスだけでフォームを作れる
ttp://wufoo.com/
ttp://docs.google.com/
みたいなので、ソースを公開しているものありませんか?
0760nobodyさん
2009/04/03(金) 00:36:01ID:???0763759
2009/04/03(金) 13:28:26ID:???確かにそうですね。ご指摘感謝します。
>>759 に挙げたサービスは、非プログラマな人が、
プログラム不要でマウスでカチカチして、
自由にアンケートフォームなどを作れるものなんです。
例えば、氏名欄を追加したり、好きな色や、食べ物などのフォームを作ることができます。
参考
ttp://journal.mycom.co.jp/news/2008/02/08/019/index.html
これを wufoo や docs.google.com を使わず、自前でやりたいなーと。
なのでオープンソースなものがあれば嬉しいなーと。
0764nobodyさん
2009/04/03(金) 21:59:47ID:???0765nobodyさん
2009/04/04(土) 21:54:54ID:???仕切りの部分をマウスでクリックしながら動的に
表示幅を変更したいのですが、どのようにやるのでしょうか?
参考にるようなサイトがあれば教えてください
0766nobodyさん
2009/04/04(土) 22:00:37ID:???0767nobodyさん
2009/04/05(日) 00:27:41ID:???最近ブラウザベースのメールソフトとか見るのですが
どうやっって変更させているのか知りたいです。
0768nobodyさん
2009/04/05(日) 11:52:10ID:???0769nobodyさん
2009/04/05(日) 14:16:25ID:???0770nobodyさん
2009/04/05(日) 14:23:43ID:???0771nobodyさん
2009/04/05(日) 16:20:45ID:???0772nobodyさん
2009/04/09(木) 01:42:02ID:???0773nobodyさん
2009/04/16(木) 21:40:02ID:???ajaxデザインパターン
0774nobodyさん
2009/05/06(水) 09:40:38ID:???検索条件の表示先と検索結果の表示先をdivで
定義し、検索を実行すると検索結果のdivを
updateするという構成の場合に、入力エラー
があった場合は、検索条件のdivをupdateして
入力エラーを表示する、ということは出来るの
でしょうか。
0775nobodyさん
2009/05/06(水) 11:29:12ID:???クライアント側でリクエスト前に検出するのかでやることは変わるが、
可能。
0776nobodyさん
2009/05/06(水) 22:40:56ID:tCnXht+4呼び出し先のtest.phpにパラメーターを渡して
表示内容を変更したいと思います。
一応、うまく動作しているのですがjqueryらしくない感じで他の方法が思いつきません。
なにか良い方法はありませんでしょうか?
function dataView(id){
$.ajax({
type : "get",
url : "./test.php",
data: "id="+id,
cache:false,
success : function(data){
$("#view").html(data);
},
error : function(){
alert("ERROR");
}
});
}
訳あって<p>タグを利用しています。
<p onClick="javascript:dataView('1');">パラメーター1</p>
<p onClick="javascript:dataView('2');">パラメーター2</p>
<p onClick="javascript:dataView('3');">パラメーター3</p>
<div id="view"></div>
0777nobodyさん
2009/05/07(木) 10:10:20ID:???> jqueryらしくない感じ
どんな感じか説明しないとレスのしようがないと思うよ
javascript:って付けるのが嫌とかなら<p>のonclickなくしてreadyとbind使うとかじゃない?
$(function(){
$('p').bind('click', function(a,b,c){
var id = /\d/.exec($(this).text())[0]; // ここは適当に
$.ajax({
type : "get",
url : "./test.php",
data: "id="+id,
cache:false,
success : function(data){
$("#view").html(data);
},
error : function(){
alert("ERROR");
}
});
});
})
<p>パラメーター1</p>
<p>パラメーター2</p>
<p>パラメーター3</p>
0779776
2009/05/08(金) 00:38:37ID:AYDdt2Ml仰る通り、「jqueryらしくない感じ = onclick使いたくない」です。
説明が解りにくいと思いますが
1.ページにアクセス(index.phpとします)
2.phpでDBからデータ取得(abc)
3.HTML生成 (<p onClick="javascript:dataView('abc');">を動的に生成)
4.生成されたhtml(index.php)からAJAXにてtest.phpにアクセス
○イメージ
<p onClick="javascript:dataView('abc');">
↓
test.php?id=abc
↓
<div id="view"></div>を動的に変更
のような処理を考えています。
そこで「onClick="javascript:dataView('xxx');"」を生成して
うまく動作しているのですが、もう少しエレガントな方法は
ないかと思い質問させて頂きました。
根本的に何か間違っている気もしています。。
0780nobodyさん
2009/05/08(金) 02:50:12ID:???とりあえずリクエストに対してサーバがやることは、エラーのある入力に
対してHTTPのクライアントエラー(4xx)を返すこと。
(422 Unprocessable Entity か 400 Bad Request が適当と思われる)
クライアント側はリクエストの結果を受けたときにそのステータスを見る
仕組みがあるだろうから、それによって置き換えるdivを切り替え。
具体的なコードは、
* 生の XMLHttpRequest なのか何らかのライブラリ使ってるのか
* サーバ側の言語は何か
少なくともこれくらいは情報がないと書けないだろう。
0782nobodyさん
2009/05/08(金) 07:49:17ID:???ステータスをいじるとプロキシやブラウザが
想定外の動きをしないか不安なのですが、
ステータスで制御するしかないですか。
*prototypeを使ってます。
*PHPです。
0783nobodyさん
2009/05/08(金) 08:29:49ID:???0785776
2009/05/08(金) 17:20:27ID:AYDdt2Ml777さんのコードはとても勉強になりました。
var id = /\d/.exec($(this).text())[0];
これでは要素の何番目をクリックしたかしかわからない
のでパラメーターを渡せないと考えています。
そこで<p>にclassかidを属性を付けてパラメーターを渡せればと考えています。
<p onClick="javascript:dataView('abc');">パラメーター1</p>
↓
<p class="abc">パラメーター1</p>
class名が解っていれば簡単なのですが
この場合、class名が動的に生成されるので
どうやって取得すれば良いか調べています。
777さんのお陰でここまで辿り着きましたが
そもそも$('p').bind('click', function()でパラメーターを渡せるのか
よく解らなくなってきております。
classやidをパラメーターとして利用するのは間違っている気もしております。
0786nobodyさん
2009/05/08(金) 18:15:47ID:???ユニークな値ならidの方がいいと思うけどね。
var id = $(this).attr('id');
に変更して、
<p id="abc">パラメーター1</p>
<p id="de">パラメーター2</p>
<p id="ef">パラメーター3</p>
みたいにしたらいいんじゃない?
0787776
2009/05/09(土) 00:28:14ID:9aQwouFi本当ですね。idの方が良いですね。
786さんの$(this).attr('id')でid名が取得できました。
ありがとうございます。
うまくいったのでソースを載せておきます。
<script type="text/javascript">
$(document).ready(function () {
$('#test p').bind('click', function(){
var id = $(this).attr('id');
alert(id);
});
});
</script>
<div id="test">
<p id="ab">パラメーター1</p>
<p id="cd">パラメーター2</p>
<p id="ef">パラメーター3</p>
</div>
0788nobodyさん
2009/07/07(火) 11:55:16ID:???ajaxSendの時にXMLHttpRequest.overrideMimeTypeを使ってるのですが
IEだと正常に働きません。
IEで文字化け対策するにはどうしたらいいのですか?
0789nobodyさん
2009/07/07(火) 12:13:50ID:???ソースのみならず、関連ファイル(text形式)全て
0790nobodyさん
2009/07/07(火) 20:06:27ID:???0791nobodyさん
2009/09/04(金) 18:47:48ID:???グリッド部分の印刷で手間取っています
0792nobodyさん
2009/09/10(木) 07:43:51ID:???初心者がjQueryを学ぶのに最適な本を教えてください
0793nobodyさん
2009/09/10(木) 23:45:54ID:???かっこいいデザイナーハウスのような犬小屋を作りたいんですが
木の板やペンキのような素材と、ノコギリとかなづちで作れますか?
っていってるようなもん
プログラムの基礎ができてるなら本なんか読まなくてもウェブのリファレンスだけで十分
0794nobodyさん
2009/09/12(土) 14:23:26ID:???アイディアが浮かびません
何かありますでしょうか
0795nobodyさん
2009/09/12(土) 16:59:06ID:???0796nobodyさん
2009/09/12(土) 20:14:19ID:???0797nobodyさん
2009/09/14(月) 12:31:21ID:???DreamWeaverモドキを作る。
題して『ウェブブラウザ使ってビジュアルHTML編集エディタ』
ってか普通にあるけど、Ajaxを利用してというのでは最適だと思う。
判らない事あっても判例多いから調べやすい。
インターフェースや操作性を工夫すればオリジナル性も出せると思う。
頑張れ!
0798nobodyさん
2009/09/19(土) 03:48:00ID:Ghzf+U1Pもしくは誘導してください
cgiから引っ張ってきた内容の表示/非表示を切り替えたいんだがよく分からん
表示はできるけど、非表示にできない
0799nobodyさん
2009/09/19(土) 03:51:29ID:Ghzf+U1Premoveメソッドだとdivごとなくなった
print qq|<script type="text/javascript" src="./jquery.js"></script>|;
print q|<script type="text/javascript">
jQuery(function($){
$('p').one("click",function () {
var number=$(this).val();
$.ajax({
type:"GET",
url: url,
data:{num: number},
success: function(msg,status){
$("#msg").prepend(msg);
}
});
});
});
</script>|;
print qq|<div id="msg">中身を表\示</div>|;
print q|<p id="contentType" value="1">AjaxTest1</p>|;
0800nobodyさん
2009/09/19(土) 07:26:37ID:KT+zhTD8やたら重いし、総じて面倒なので、動的に動かすなら、jquery
と ahah でいいや。
あ、prototype のことね。
0801nobodyさん
2009/09/20(日) 00:08:40ID:???つか、ttp://semooh.jp/jquery/ こことか見て理解すらできないなら
HTML、XHTML、Stylesheetあたりと、DOMとかのさわりくらいは勉強しれ
基本ができてないのにそれを操作するための道具があっても意味ないだろ
なんだかサーバサイドとクライアントサイドの区別すらろくについてないようだし難しいかしら…(´・ω・`;)
0802nobodyさん
2009/09/23(水) 22:14:06ID:l9viFuyu↑の例で言うと<div id="msg">の手前にcgiから引っ張ってきた内容が挿入されるんだけど
それをどうやって消したものかと思ってたんだ
結局cgiからの出力の際に適当なidつけて、$("#hoge").hide()でできた
0803nobodyさん
2009/09/27(日) 00:26:16ID:???同期でも固まらないHTTPクライアントを作った
けど、クラスの中に入れるとどうしても同期しない。
何かいい方法ないかなー。
つーか、JSでRIAできないのは、コンパクトな設計
に分散させることができない自分の不甲斐なさでは
あるんだけど。
0804nobodyさん
2009/09/28(月) 10:55:25ID:???id="hoge"をタグに付けなくても、
$("#msg").prev()
で、その要素を取得できない?
prependで自分の前に追加したやつはprevで取得できたと思う
appendならnextみたいな感じで。
0805nobodyさん
2009/09/28(月) 22:36:18ID:???サーバー側でHTMLをjqueryライクな書き方で整形できるよ。
http://code.google.com/p/phpquery/
$doc = phpQuery::newDocumentHTML("http://www.yahoo.co.jp/");
$html = $doc['div'] -> html();
サーバーサイド側でこんな簡単にHTMLが抜け出せる。
正規表現も使わないで済む。jqueryライクな書き方でOK
0806nobodyさん
2009/09/29(火) 00:29:20ID:oD0uVWyEまじか
そっちの方がスマートだな
ありがとう
0807nobodyさん
2009/09/29(火) 05:55:37ID:???canvasに描くと同時に随時jsonに独自フォーマットで記述していくのでしょうか。
get○○的なメソッドで簡単に取り出せないものでしょうか。
0808nobodyさん
2009/11/02(月) 00:57:11ID:JG9uz1owhttp://docs.jquery.com/UI/Dialog
のダイアログに表示される文字を、画面上のあるテキストボックスに入力された値にしたいのですが、
どのようにすればよろしいのでしょうか?
function showConfirm(e) {
$('#dialog').attr('title', e.name).dialog({
・
・
・
<div id="dialog" title="Delete this customer?" style="display:none;">
<p>
<span class="ui-icon ui-icon-alert" style="float:left; margin:0 7px 20px 0;"></span>
現在はこの文字列が表示されています。
</p>
</div>
”現在はこの文字列が表示されています。”という文字列の変わりに、フォーム上のあるテキストボックスに入力
された値を入れて表示させたいのです。
ちなみにASP.NETです。
0809808
2009/11/02(月) 02:26:07ID:JG9uz1owasp:LabelとinnerHTMLで解決しました!
0810nobodyさん
2009/11/12(木) 21:53:40ID:???Ajaxのフレームワークってどれがおすすめ?
Eclipseにも対応してるGoogle Web Toolkitを使ってみようかと思ったけど
このスレでレス抽出しても1回も出てこないし・・
他のを使ったほうがいいの?
0811nobodyさん
2009/11/12(木) 22:16:16ID:???変わってくると思う。
個人的にはExt.jsで全部書いてみたくなることがある。
0812810
2009/11/12(木) 23:18:59ID:???サンクス
0813nobodyさん
2009/11/13(金) 00:39:17ID:???ExtJSを直接使う方が速くて軽くて馬なんだが
0814nobodyさん
2009/11/19(木) 14:33:08ID:???画面もレスポンスもともにUTF-8になっているにもかかわらず、
IEでresponseTextを実行しようとすると、
「c00ce56e のため〜」がでて実行できない・・・。
いろいろググってみても、
「UTF-8以外の場合出ることがある」
としか書かれてなくて、もうお手上げ状態。
ちなみにFxでは正常に表示されています。
0816nobodyさん
2009/11/19(木) 15:27:00ID:???出てます・・・。
発生環境を書いていなかったので、書いておきます。
・PHP(Ethnaを使用)
・OSはWindowsXP(最終的にはCentOSでの稼働)
・IEのバージョンは7
Ethnaは画面表示として、Smartyを用いていますが、そこがあやしいのかも知れないです。
ただ、responseTextをする前に、getRequestHeader()でContent-Typeを見てみたら、
「text/html; charset=utf8」と返ってきているので、UTF8を出しているんだとは思うんですが・・・。
0817nobodyさん
2009/11/19(木) 19:33:15ID:???0818nobodyさん
2009/11/20(金) 09:27:28ID:???PHPは、よく知らないんだけど、
ヘッダーの文字コードがutf8だからって、
レスポンスの中身がutf8だって保証は無いんじゃないん?
PHPだと文字コードを自動で変換してくれたりするのかな。
0819nobodyさん
2009/11/20(金) 11:16:38ID:???apacheから出る時に勝手にsjisとかeucになってることがある。
ajaxから呼んでいるURLにブラウザからアクセスしてみて、実際に出てきているエンコードを見てみては?
post送信が必要ならスクリプトの最初でダミーの$_POSTを設定すればいい。
■ このスレッドは過去ログ倉庫に格納されています