2011-01-25 11 views
0

私はいくつかのMySQLテーブルを表示したいページがあります。
右側には、異なる人物を選択した場合にのみ変更できるテーブルが1つあります。
2番目のテーブルは中央のメインテーブルです。私はすべての人を含むドロップダウンボックスを持っています。選択された人物の結果が中央の表に示されます。各人に複数の結果が表示されるので、表示する結果を選択するための2番目のドロップダウンボックスがあります。これは、Ajax XMLHTTPリクエストによって行われます。JavaScriptを使用したAjaxリクエスト

問題は、適切な表がいくつかのjavascriptを使用していることです。私はこれがAjaxとXMLHTTPリクエストとの組み合わせでは不可能であることを知っています。しかし、javascriptがなければ、私は自分が望むものを作ることができません。 javascriptが彼の仕事を終えた後に正しい表を見せる方法はありますか?

私は現在フレームを使用しています。これはあまりいいことではありません。私は一緒に素敵に見えるように両方のページをスタイルする必要があるので、それは言ったように簡単ではありません。しかし、このように私はそれが欲しいと思っています。

だから私は、インターネット(長い時間)を検索し、私はあきらめたかったほんの数分前に私は、コードのこの部分は、(http://www.javascriptkit.com/dhtmltutors/ajaxincludes.shtmlから来る)が見つかりました:

function HttpRequest(url){ 
var pageRequest = false //variable to hold ajax object 
    /*@cc_on 
     @if (@_jscript_version >= 5) 
     try { 
     pageRequest = new ActiveXObject("Msxml2.XMLHTTP") 
     } 
     catch (e){ 
      try { 
      pageRequest = new ActiveXObject("Microsoft.XMLHTTP") 
      } 
      catch (e2){ 
      pageRequest = false 
      } 
     } 
     @end 
    @*/ 

    if (!pageRequest && typeof XMLHttpRequest != 'undefined') 
     pageRequest = new XMLHttpRequest() 

    if (pageRequest){ //if pageRequest is not false 
     pageRequest.open('GET', url, false) //get page synchronously 
     pageRequest.send(null) 
     embedpage(pageRequest) 
    } 
} 

function embedpage(request){ 
    //if viewing page offline or the document was successfully retrieved online (status code=2000) 
    if (window.location.href.indexOf("http")==-1 || request.status==200) 
     document.write(request.responseText) 
    } 
} 

HttpRequest("external.htm") //include "external.htm" onto current page 

このコードは完璧に動作します。.. 。 初めて。あなたが人を変えるとすぐにページ全体が消え、テーブルだけが現れ、firefoxはページを "ロード"し続けます(あなたはそのサークルが回っているのを見ています)。上記のコードを私のニーズに合わせて編集する方法はわかりますが、Ajaxやこの問題を解決する方法については理解していません。うまくいけば、誰かが私を助け、私に良い解決策を与えることができます!上記のコードが正しく動作しない理由を教えてください。

ありがとうございます!ページのレンダリングが完了すると、ページが最初のページがクリアされますdocument.writeを呼び出して、最初にロードされたときに

Milaan

答えて

0

It'sはI'veは、このようなコードを見て以来、長い間あったが、私が見ることができる一つの問題は、ということですXMLHttpRequestには変数を含めないでください。ユーザーIDなどはありません。静的なページを読み込むだけですか?

jQueryのようなライブラリを使用できない理由はありますか?それは魔法の弾丸ではありませんが、それはあなたの人生とアヤックスのリクエストをより簡単にするでしょう。

+0

これは私がインターネットから使った例でしたが、いくつかの変数を含む私のバージョンでは何の違いもありませんでした。 私はjQueryを知っていますが、それはより良いですか?それは簡単ですか? 私はそれからいくつかの基礎を知っているので、私は(Ajaxを含む)すべてを学ばなければならないでしょう。 – Milaan

+0

@Milaan、私はフレーム(jQueryの有無にかかわらず)を取り除くのが良いと思うし、最も基本的なajaxリクエストを使用して、あなたのPHPスクリプトの出力を '.load() ':http://api.jquery.com/load/ – jeroen

+0

ありがとうございました!それは確かに私のフレームより良い方法です(私はそれらを自分で使用することはありませんが、それは唯一の解決策と思われます)。 jQueryでも中間テーブルを作成する必要がありますか? 私がやった方がいいかもしれませんね。 – Milaan

2

document.writeにのみ機能します。あなたの代わりに何をしたいかもしれないもの

https://developer.mozilla.org/en/document.write

です:

if (window.location.href.indexOf("http")==-1 || request.status==200) { 
    var elm = document.createElement('div'); 
    elm.innerHTML = request.responseText; 
    document.getElementsByTagName('body')[0].appendChild(elm); 
} 
+0

ワットは、私は、その後にそれを変更する必要があります。

$.post("somepage.php", function(data){ $("#divID").html(data); }); <div id="divID"></div> 

そしてsomepage.phpは次のようなものだろうか? 私は試しました:document.getElementById('maintable').innerHTML = response Text; しかし、それもうまくいかなかった... または私は間違いをしましたか? – Milaan

0

あなたは次のように、既存のドキュメントにダウンロードしたコンテンツを追加するDOM関数を使用する場合があります

document.getElementById('mypanel').innerHTML = '<html code goes here>'; 

最高のアイデアは、おそらくブラウザの互換性であなたを助けスリムjavascriptのフレームワーク嘘のjqueryのを使用することです。

+0

ジェロエンも同じことを言った。ですから、私にとって最善のことは、jQueryがAJAXリクエストでどのように動作するかを確認することです。 jQueryにAjaxリクエストを実行させて、テーブルを返し、jQueryに返されたテーブルをJavascriptで実行させます。 – Milaan

0

jQueryを使用すると、操作が簡単になります。あなたのコードは次のようになります。

<?php 
    // get table content 
    echo "<table>...</table>"; 
?> 
+0

お返事ありがとうございます!これは確かにずっと良いです。私はすでにjQueryを知っていましたが、すべてこれを行うことができませんでした。これは確かに手頃である。ありがとう! – Milaan

関連する問題