2012-05-02 8 views
1

を存在するの下で確認するには、次の例を見てみてください:最初の例でjqPlot - どのようにプログラムでのjQuery UIのタブプロットが

http://www.jqplot.com/deploy/dist/examples/hiddenPlotsInTabs.html

を、隠されたグラフは、「tabshowを」キャッチでプロットされています選択したタブのイベントと発見:

$('#tabs').bind('tabsshow', function (event, ui) { 
    if (ui.index === 1 && plot1._drawCount === 0) { 
     plot1.replot(); 
    } else if (ui.index === 2 && plot2._drawCount === 0) { 
     plot2.replot(); 
    } 
}); 

これはうまく動作しますが、あなたはより多くのタブを追加し、他のタブにあなたのプロットを移動した場合、手動でハードコード化された「ui.index」の値を更新する必要があるだろう、私は私のプロジェクトでは避けたいのです。

あなたのプロットがどのタブの下にプログラムで見つかるかを知っている人はいますか?私はあなたが持っているタブの数とあなたのプロットを配置する場所に関係なく、そうした方法でコーディングしたいと思います。

+0

+1非常に興味深いあなたが実際にやろうとしているものそれ。ドラッグ&ドロップを私の周りのチャートに使用しようとしていますか?可能であれば、あなたがコーディングしているものの最終結果に興味があります:) – Boro

答えて

1

あなたは次のようにそれにアプローチする必要があります。

  1. は、あなたがどこから検索したいグラフのIDを取ります。
  2. jQueryを使用してグラフを選択します。
  3. parent()メソッドを使用して親を見つける---これはそれを含むタブです。
  4. 親のattr('id')を使用してIDを取得します。

This is how I show it in jsfiddle sample available here.

EDIT

私はあなたが効果的にui.indexで選択されたタブのインデックスを取得したい理解して何から。私はjQuery UIで準備する方法を見つけることができなかったので、これは(このコードは、以前のjsfiddle試料に添加される)私はそれを達成する方法である:

var tabIndex = -1; 
    $("#tabs ul li").each(function(index){ 
     if('#'+tabId === $(this).find("a").attr('href')){ 
      tabIndex = index; 
      return false; 
     } 
    }); 
+0

おかげさまですが、parent()を実行した後に親タブの "ui.index"をどう取得しますか?ここでは、タブのidがtab-1、tabs-2、tabs-3のように指定されていないと仮定しています。それらがあれば、 "ui.index"値を取得するのは簡単でしょう。 – jpen

+0

jpen私のコードを見つけてください** **編集** – Boro

+0

はい、トリックでした:)あなたの助けをありがとうBoro! – jpen

関連する問題