Добавление диалога во вкладке в jquery - PullRequest
Новая
       22

Добавление диалога во вкладке в jquery

1 голос
/ 12 мая 2011

Я сделал диалоги и вкладки. Работает нормально. Но я хочу добавить / показать диалог во вкладках. например, если щелкнуть вкладку1, открывается диалоговое окно1 или показывается на вкладке, если щелкнуть вкладку 2, открывается диалоговое окно 2 или показывается на вкладке. Мне просто нужна помощь в этом, как это сделать. Большое спасибо.

Диалог и таб. 

<div id="dialog">
<table id="myTable" width="100%" border="0"  cellspacing="1" cellpadding="2 class="draggable ui-widget"> 
<thead class="ui-widget-header"> 
<tr> 
<th><strong>Symbol</strong><span class="ui-icon ui-icon-triangle-2-n-s" style="position:absolute;top:15%;margin-top:-8px"></span></th> 
<th><strong>Price</strong><span class="ui-icon ui-icon-triangle-2-n-s" style="position:absolute;top:15%;margin-top:-8px"></span></th> 
<th><strong>Volume</strong><span class="ui-icon ui-icon-triangle-2-n-s" style="position:absolute;top:15%;margin-top:-8px"></span></th> 
<th><strong>Buy</strong><span class="ui-icon ui-icon-triangle-2-n-s" style="position:absolute;top:15%;margin-top:-8px"></span></th> 
<th><strong>Sell</strong><span class="ui-icon ui-icon-triangle-2-n-s" style="position:absolute;top:15%;margin-top:-8px"></span></th> 
</tr> 
</thead> 
</div>

<div id="tabs" class="ui-tabs ui-widget ui-widget-content ui-corner-all" id="tabs">
<ul>
<li class="ui-state-default ui-corner-top ui-tabs-selected ui-state-active"><a href="#tabs-1">Market1</a></li>
    <li class="ui-state-default ui-corner-top ui-tabs-selected ui-state-active"><a href="#tabs-2">Market2</a></li>
    <li class="ui-state-default ui-corner-top ui-tabs-selected ui-state-active"><a href="#tabs-3">Market3</a></li>
</ul>
<div id="tabs-1" class="ui-tabs-panel ui-widget-content ui-corner-bottom">

</div>
<div id="tabs-2" class="ui-tabs-panel ui-widget-content ui-corner-bottom">

</div>
<div id="tabs-3" class="ui-tabs-panel ui-widget-content ui-corner-bottom">

</div>

и это мой сценарий. 

<script>
$(document).ready(function() 
   { 
    //$(function() {
    $("#tabs").tabs();      
    //});

 $("#dialog").dialog({title:'MarketWatch',minHeight:50,width:1000});        

 } 
); 
</script>

1 Ответ

0 голосов
/ 12 мая 2011

Я думаю, что нет прямого способа сделать это.

Но вы можете добиться того же, переместив DOM диалога с тега body на DOM специфичного для вкладка DOM.

  1. Вы можете использовать select или show плагина вкладки, чтобы открыть диалоговое окно.
  2. После open событие диалога, смещение DOM.

FYI: убедитесь, что вы используете опцию autoOpen при настройке диалога.Таким образом, ваш диалог теперь будет в пределах вкладки и не будет виден, даже если пользователь перейдет на другую вкладку.

Надеюсь, это поможет.

...