# Facing issues while creating Tabbed Configuration Page for module

**URL:** <https://forum.inductiveautomation.com/t/facing-issues-while-creating-tabbed-configuration-page-for-module/17085>\
**Category:** 3rd Party Modules\
**Tags:** sdk, ignition79\
**Created:** [February 22, 2018, 6:37am UTC](https://forum.inductiveautomation.com/t/facing-issues-while-creating-tabbed-configuration-page-for-module/17085 "2018-02-22T06:37:00Z")\
**Posts on this page:** 8\
**Page:** 1

<div class="post-metadata">

**Author:** ![Yogini\_Marathe](https://avatars.discourse-cdn.com/v4/letter/y/85e7bf/32.png) [@Yogini\_Marathe](https://forum.inductiveautomation.com/u/Yogini_Marathe)\
**Post date:** [February 22, 2018, 6:37am UTC](https://forum.inductiveautomation.com/t/facing-issues-while-creating-tabbed-configuration-page-for-module/17085/1 "2018-02-22T06:37:00Z")

</div>

Hi,

We would like to create a Tabbed Configuration Page for a custom module we are developing.

I was able to get basic settings page created by following home-connect-example from SDK Examples.

I was also able to get multiple links created for multiple settings pages as mentioned in  
[Wicket Configuration Panel?](http://forum.inductiveautomation.com/t/wicket-configuration-panel/4343)

Creating a configuration Page that extends from RecordEditForm and/or RecordActionTable works fine.  
However I get an error as shown below when trying to create configuration page that extends from TabbedConfigPanel:  
[ErrorLOg.txt](https://us1.discourse-cdn.com/inductiveautomation/original/2X/e/e71d8a68de1c9e2bbae4831bbfd472926e8436cc.txt) (11.5 KB)

Also attached is the code from GatewayHook and ConfigPage  
[Code.txt](https://us1.discourse-cdn.com/inductiveautomation/original/2X/6/658c625ba4dc92f00c2fba3eb0696b1abddb00e0.txt) (2.2 KB)

I am trying to add two separate configuration tabs into single tabbed config panel.  
Appreciate help in this regard.

I am using Ignition version 7.9.6 and SDK 7.9.3

---

<div class="post-metadata">

**Author:** ![chi](https://avatars.discourse-cdn.com/v4/letter/c/0ea827/32.png) [@chi](https://forum.inductiveautomation.com/u/chi)\
**Post date:** [February 22, 2018, 3:11pm UTC](https://forum.inductiveautomation.com/t/facing-issues-while-creating-tabbed-configuration-page-for-module/17085/2 "2018-02-22T15:11:17Z")

</div>

There is a module on [GitHub](https://github.com/chi-Ignition/generic-tcp-driver) that uses a tabbed config panel. You may use that as an example. When i made that module i took me some time to understand how Wicket works.

---

<div class="post-metadata">

**Author:** ![KathyApplebaum](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/kathyapplebaum/32/7261_2.png) [@KathyApplebaum](https://forum.inductiveautomation.com/u/KathyApplebaum)\
**Post date:** [February 22, 2018, 3:57pm UTC](https://forum.inductiveautomation.com/t/facing-issues-while-creating-tabbed-configuration-page-for-module/17085/3 "2018-02-22T15:57:30Z")

</div>

It may be best to just stick with a single system. The config pages in the home connect example use React to display the page and send the info to Java – this is the way Ignition will be doing gateway pages going forward. Using Wicket is the way we used to do config pages, and is much harder to implement. Definitely don’t mix the two on a single page.

---

<div class="post-metadata">

**Author:** ![Yogini\_Marathe](https://avatars.discourse-cdn.com/v4/letter/y/85e7bf/32.png) [@Yogini\_Marathe](https://forum.inductiveautomation.com/u/Yogini_Marathe)\
**Post date:** [February 23, 2018, 7:55am UTC](https://forum.inductiveautomation.com/t/facing-issues-while-creating-tabbed-configuration-page-for-module/17085/4 "2018-02-23T07:55:25Z")

</div>

Thanks Chi and Kathy, would try that out.

---

<div class="post-metadata">

**Author:** ![Yogini\_Marathe](https://avatars.discourse-cdn.com/v4/letter/y/85e7bf/32.png) [@Yogini\_Marathe](https://forum.inductiveautomation.com/u/Yogini_Marathe)\
**Post date:** [February 24, 2018, 9:17am UTC](https://forum.inductiveautomation.com/t/facing-issues-while-creating-tabbed-configuration-page-for-module/17085/5 "2018-02-24T09:17:58Z")

</div>

Hi Kathy,

I am trying to build a custom configuration Page using React.  
I was following the home-connect-example and was able to add my custom React Page as a Status Panel.  
However how do I add the same as a Configuration Page?

The getConfigPanels method from GatewayModuleHook does not allow returning Panel that implement INamedTab interface , instead requires IConfigTab.

If I have my config class implement IConfigTab, overriding the method public WebMarkupContainer getPanel(String panelId) has no effect.  
I get the blank page.

Please suggest.

---

<div class="post-metadata">

**Author:** ![KathyApplebaum](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/kathyapplebaum/32/7261_2.png) [@KathyApplebaum](https://forum.inductiveautomation.com/u/KathyApplebaum)\
**Post date:** [February 26, 2018, 3:15pm UTC](https://forum.inductiveautomation.com/t/facing-issues-while-creating-tabbed-configuration-page-for-module/17085/6 "2018-02-26T15:15:34Z")

</div>

Hmm… I thought we had added examples of both config and status in react. As soon as I get a chance I’ll add that to the example.

---

<div class="post-metadata">

**Author:** ![Yogini\_Marathe](https://avatars.discourse-cdn.com/v4/letter/y/85e7bf/32.png) [@Yogini\_Marathe](https://forum.inductiveautomation.com/u/Yogini_Marathe)\
**Post date:** [February 27, 2018, 4:04am UTC](https://forum.inductiveautomation.com/t/facing-issues-while-creating-tabbed-configuration-page-for-module/17085/7 "2018-02-27T04:04:11Z")

</div>

Thanks Kathy. That would be of great help.

---

<div class="post-metadata">

**Author:** ![astraea.leary](https://avatars.discourse-cdn.com/v4/letter/a/ecd19e/32.png) [@astraea.leary](https://forum.inductiveautomation.com/u/astraea.leary)\
**Post date:** [November 12, 2019, 5:37pm UTC](https://forum.inductiveautomation.com/t/facing-issues-while-creating-tabbed-configuration-page-for-module/17085/8 "2019-11-12T17:37:57Z")

</div>

Kathy,

Have you had a chance to upload those examples? Was taking a look at the current examples and I believe I only see a React example for the status page (ConnectStatus.jsx) and not one for the config page.

Thanks,

George
