Wt Widget Gallery

Forms — widgets and support classes for capturing user information

Radio buttons

Wt provides different kinds of button widgets. The WRadioButton class provides options which are usually mutually exclusive in contrast to WCheckBoxs which provide independent on/off options.

An instance of WRadioButton corresponds to an HTML <input type="radio"> element.

Use a WButtonGroup to group together radio buttons that reflect options that are mutually exclusive. With event handling you can follow up any change in the selection.

By default, radio buttons are inline. You will need to use setInline(false) to let them stack vertically.

Loose buttons

Example
source 
#include <Wt/WContainerWidget.h>
#include <Wt/WRadioButton.h>

auto container = Wt::cpp14::make_unique<Wt::WContainerWidget>();

container->addWidget(Wt::cpp14::make_unique<Wt::WRadioButton>("Radio me!"));
container->addWidget(Wt::cpp14::make_unique<Wt::WRadioButton>("Radio me too!"));

Button group

Usually, you'll group a set of radio buttons together in a WButtonGroup, so that only one can be selected at a time.

Example
source 
#include <Wt/WButtonGroup.h>
#include <Wt/WContainerWidget.h>
#include <Wt/WRadioButton.h>
#include <Wt/WTemplate.h>

auto container = Wt::cpp14::make_unique<Wt::WContainerWidget>();

auto group = std::make_shared<Wt::WButtonGroup>();
Wt::WRadioButton *button;

button =
    container->addWidget(Wt::cpp14::make_unique<Wt::WRadioButton>("Radio me!"));
group->addButton(button);

button =
    container->addWidget(Wt::cpp14::make_unique<Wt::WRadioButton>("No, radio me!"));
group->addButton(button);

button =
    container->addWidget(Wt::cpp14::make_unique<Wt::WRadioButton>("Nono, radio me!"));
group->addButton(button);

group->setSelectedButtonIndex(0); // Select the first button by default.

Top

Stacked buttons

Since by default, radio buttons are inline, you will need to use setInline(false) to let them stack vertically.

Example
source 
#include <Wt/WButtonGroup.h>
#include <Wt/WContainerWidget.h>
#include <Wt/WRadioButton.h>

auto container = Wt::cpp14::make_unique<Wt::WContainerWidget>();

auto group = std::make_shared<Wt::WButtonGroup>();
Wt::WRadioButton *button;

button =
    container->addWidget(Wt::cpp14::make_unique<Wt::WRadioButton>("Radio me!"));
button->setInline(false);
group->addButton(button);

button =
    container->addWidget(Wt::cpp14::make_unique<Wt::WRadioButton>("No, radio me!"));
button->setInline(false);
group->addButton(button);

button =
    container->addWidget(Wt::cpp14::make_unique<Wt::WRadioButton>("Nono, radio me!"));
button->setInline(false);
group->addButton(button);

group->setSelectedButtonIndex(0); // Select the first button by default.

Top

Events

You can process a new selection with a signal/slot mechanism. In the example below the signal checkedChanged() of the WButtonGroup is passed to an inner function passing a WPushButton. You can see that there are two ways to get the id assigned to a button, namely group->id(selection) and group->checkedId().

Example
source 
#include <Wt/WButtonGroup.h>
#include <Wt/WContainerWidget.h>
#include <Wt/WRadioButton.h>
#include <Wt/WString.h>
#include <Wt/WText.h>

auto container = Wt::cpp14::make_unique<Wt::WContainerWidget>();
auto group = std::make_shared<Wt::WButtonGroup>();

Wt::WRadioButton *rb;

rb = container->addWidget(Wt::cpp14::make_unique<Wt::WRadioButton>("sleeping"));
rb->setInline(false);
group->addButton(rb, 1);

rb = container->addWidget(Wt::cpp14::make_unique<Wt::WRadioButton>("eating"));
rb->setInline(false);
group->addButton(rb, 2);

rb = container->addWidget(Wt::cpp14::make_unique<Wt::WRadioButton>("driving"));
rb->setInline(false);
group->addButton(rb, 3);

rb = container->addWidget(Wt::cpp14::make_unique<Wt::WRadioButton>("learning Wt"));
rb->setInline(false);
group->addButton(rb, 4);

group->setSelectedButtonIndex(0); // Select the first button by default.

Wt::WText *out = container->addWidget(Wt::cpp14::make_unique<Wt::WText>());

// Use a raw pointer inside the lambda to prevent memory leak
auto rawGroup = group.get();
group->checkedChanged().connect([=] (Wt::WRadioButton *selection) {
    Wt::WString text;

    switch (rawGroup->id(selection)) {
    case 1: text = Wt::WString("You checked button {1}.")
            .arg(rawGroup->checkedId());
	break;

    case 2: text = Wt::WString("You selected button {1}.")
            .arg(rawGroup->checkedId());
	break;

    case 3: text = Wt::WString("You clicked button {1}.")
            .arg(rawGroup->checkedId());
	break;
    }

    text += Wt::WString("... Are your really {1} now?")
	.arg(selection->text());

    if (rawGroup->id(selection) == 4)
        text = Wt::WString("That's what I expected!");

    out->setText(Wt::WString("<p>") + text + "</p>");
});

More details on events

Top