Failure to update JPanels inside CardLayout

Question

I have two JPanels nested inside a cardPanl(with a cardLayout).

When switching between pages I need to have new instance of the page created. For example when I switch from homePage to captchaPage, I will replace the current homePage with a new instance of 'HomePage'. same thing goes when switching from captchaPage to homePage.

I will create the new instances without any problem but what I see on the screen is the old view of the JPanels meaning they do not get repainted.

I've searched for this problem and almost all the solutions suggest calling revalidate(), validate() or repaint() on the panel.

I've did it all and still I get the old view. I'm sure that creating the new instances is done successfully because when printing the capthcha in the console i see that it changes but the view remains the same.

Here is my structure:

BasicPage.java

public class BasePage extends JPanel {
    protected JFrame parent;
    protected String name;
    public BasePage(JFrame parent, String name) {
       this.parent = parent;
       this.name = name;
       // ...
    }
}

CaptchaPage.java

public class CaptchaPage extends BasePage {
    private String challenge;
    public CaptchaPage(JFrame parent, String name) {
        super(parent, name);
        challenge = new BigInteger(130, new SecureRandom()).toString(32);
        challenge = challenge.length() > 5 ? challenge.substring(0, 5) : challenge;
        JLabel label = new JLabel(challenge);
        this.add(label);
    }
}

Dashboard.java

public class Dashboard extends JFrame {
    private JPanel cardPanel;

    private BasePage homePage;
    private BasePage captchaPage;

    public Dashboard() {
        cardPanel = new JPanel();
        cardPanel.setLayout(new CardLayout());

        homePage = new HomePage(this, "0");
        captchaPage = new CaptchaPage(this, "1");

        cardPanel.add(homePage, "0");
        cardPanel.add(captchaPage, "1");

        this.add(cardPanel);
    }

    protected void switchPage(String name) {        
        ((CardLayout)cardPanel.getLayout()).show(cardPanel, name);

        if (name.equals("1")) {
            homePage = new HomePage(this, "0");
            homePage.revalidate();
        }
        else {
            captchaPage = new CaptchaPage(this, "1");
            captchaPage.revalidate();
        }
    }    
}

Answer

BasePage page = new HomePage(this, "0");
cardPanel.add(page, "0");
cardPanel.revalidate();
homePage = page;

Answer 1

You added panels to the CardLayout with the following code which is correct:

cardPanel.add(homePage, "0");
cardPanel.add(captchaPage, "1");

Now you are trying to update the CardLayout with code like:

homePage = new HomePage(this, "0");

That will not work. All you are doing is changing the reference of the homepage variable. You have not added the component to the CardLayout.

To change the panel then code should be the same as the code you used to add the panel initially:

JPanel homepage = new HomePage(...);
cardPanel.add(...);

Why are you changing the components on the panel? Why does the homepage change. Sounds like a strange design to me.