php - jQueryタブ付きAjaxコンテンツ

Question

したがって、クエリを使用して3つのタブを作成する必要があります（この部分を削除します）が、それぞれがAjaxリクエストを介してフィルター可能なデータを取得する必要があります。基本的に、ページは左側にフィルターが入った静的divで設定され、右側では選択したタブに応じてタブが変化します。

ajaxコンテンツを取得して各タブに配置するための最良の方法は何でしょうか？

質問を明確にしたいと思います。

Answer 1

私があなたの質問を正しく理解していれば、これはかなり簡単なはずです。たとえば、静的なWebページを取得し、そのWebページのすべてのコンテンツをコンテナdivに挿入するとします...

$('#tab1').click(function(){
    //Fetch a webpage (via GET) and load into 'result'
    $.get('/path/to/stuff.htm',function(result){
        //Replace content of container with result
        $('#containerDiv').html(result);
    });
});

とても簡単です。結果の一部が必要な場合（XMLRPCリクエストからCDATAを抽出するなど）、結果をjQueryオブジェクトとしてロードし、要素を見つけて、それをロードするだけです...

$('#tab1').click(function(){
    //Fetch a webpage (via GET) and load into 'result'
    $.get('/path/to/stuff.htm',function(result){
        //Make result a jQuery obj
        result = $(result);
        //Replace content of container with result
        $('#containerDiv').html(result.find('mycdata').text());
    });
});

また、CDATAでラップされたXML結果がある場合は、htmlとして挿入する場合でも、常に.text（）として読み取ってください。結果がCDATAでラップされていない場合は、.html（）として読み取ります。

更新：サーバーに追加のデータを送信する必要がある場合（ASCまたはDESCの並べ替えなど）、これを行うことができます...

$('#tab1').click(function(){
    //Fetch a webpage (via GET) and load into 'result'
    $.get(
        '/path/to/service', 
        { sort:'ASC', startDate:'2012-04-01', endDate:'2012-04-08'}, 
        function(result){
            //Replace content of container with result
            $('#containerDiv').html(result);
        }
    );
});