jQueryタブ付きAjaxコンテンツ

Question

クエリを使用して3つのタブを作成する必要がありますが、それぞれがAjaxリクエストでフィルタ可能なデータを取得する必要があります。基本的に、ページには左側に静的なdivが設定され、右側には選択したタブに従って右側のタブが表示されます。

私はちょうどajaxコンテンツをつかんで各タブに入れるのに最適な方法は何だろうと思いますか？

私は私の質問を明確にしたいと思う。

Answer 1

私はあなたの質問を正しく理解しているなら、これはかなり簡単です。例えば、

$('#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); 
    }); 
}); 

それは本当に簡単です...あなたは、静的なWebページを取得し、単にあなたのコンテナのdivにそのWebページのすべてのコンテンツを挿入したいとしましょう。 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（）として読み込みます。

UPDATE：あなたは、サーバー（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); 
     } 
    ); 
});