Достаточно простым способом было бы отключить все вкладки с пустым содержимым, кроме той, которая загружается вместе со страницей.
Из того, что я вижу из простого источника, они имеют такую структуру.
<div class="TabbedPanels" id="tp1">
<ul class="TabbedPanelsTabGroup">
<li class="TabbedPanelsTab" tabindex="0">Tab 1</li>
<li class="TabbedPanelsTab" tabindex="0">Tab 2</li>
<li class="TabbedPanelsTab" tabindex="0">Tab 3</li>
<li class="TabbedPanelsTab" tabindex="0">Tab 4</li>
</ul>
<div class="TabbedPanelsContentGroup">
<div class="TabbedPanelsContent"> Tab 1 Content </div>
<div class="TabbedPanelsContent"> Tab 2 Content </div>
<div class="TabbedPanelsContent">
<p>Tab 3 Content </p>
<p>More Content</p>
<p>More Content</p>
</div>
<div class="TabbedPanelsContent"> Tab 4 Content</div>
</div>
</div>
Присоедините прослушиватели событий onclick к # tp1.TabbedPanelsTab и свяжите их с запросом ajax. Когда пользователь нажимает на вкладку, он запускает запрос и заполняет форму.
Может быть проще добавить идентификатор, который указывает, где получить данные для этой конкретной формы. Например, вкладка 1 может иметь идентификатор «salesRecords». Допустим также, что вы получаете все свои данные из getContent.php. Теперь, когда пользователь активирует событие onclick, вы используете ajax-запрос для извлечения информации из url "getContent.php?id="+this.id
, который, конечно, будет использовать строку запроса для возврата информации об отдыхе.