How do you set the default button in a set of buttons?

[Justin Mclean]

Hi,

Often when you have a set of buttons you want to make one be the default.

Say for instance you had:
<js:HContainer>
    <js:TextButton text="One"  />
    <js:TextButton text="Two"  />
    <js:TextButton id="important" text=“Important" />
</js:HContainer>

and want to make the important button the default one / give it focus.

Currently I think  you need to do something like this:

COMPILE::JS {
    important.element.focus();
}
COMPILE::SWF {
    // TODO not 100% sure what's needed here
}

Is there a better cross platform way of doing this? Should the framework have an API for setting button focus?

Thanks,
Justin

[Andrew Wetmore]

isn't there a "selected" option?

On Sun, Nov 26, 2017 at 8:17 PM, Justin Mclean <[hidden email]> wrote:

Hi,

Often when you have a set of buttons you want to make one be the default.

Say for instance you had:
<js:HContainer>
    <js:TextButton text="One"  />
    <js:TextButton text="Two"  />
    <js:TextButton id="important" text=“Important" />
</js:HContainer>

and want to make the important button the default one / give it focus.

Currently I think  you need to do something like this:

COMPILE::JS {
    important.element.focus();
}
COMPILE::SWF {
    // TODO not 100% sure what's needed here
}

Is there a better cross platform way of doing this? Should the framework have an API for setting button focus?

Thanks,
Justin

--

[Justin Mclean]

Hi,

> isn't there a "selected" option?

Sadly not. There is a ButtonBar component with a selected index property but it rather limited/restrictive in how you can use it.

An example:
<js:ButtonBar dataProvider="['One','Two','Important']" selectedIndex="2"  percentWidth="100" height="50" />

But it dosn't seem to set the focus to the initial selected index which is probably a bug?

Thanks,
Justin

[Harbs]

Why do you want to set the focus? Wouldn’t different styling be more appropriate?

> On Nov 27, 2017, at 2:17 AM, Justin Mclean <[hidden email]> wrote:
>
> Hi,
>
> Often when you have a set of buttons you want to make one be the default.
>
> Say for instance you had:
> <js:HContainer>
>    <js:TextButton text="One"  />
>    <js:TextButton text="Two"  />
>    <js:TextButton id="important" text=“Important" />
> </js:HContainer>
>
> and want to make the important button the default one / give it focus.
>
> Currently I think  you need to do something like this:
>
> COMPILE::JS {
>    important.element.focus();
> }
> COMPILE::SWF {
>    // TODO not 100% sure what's needed here
> }
>
> Is there a better cross platform way of doing this? Should the framework have an API for setting button focus?
>
> Thanks,
> Justin
>

[Justin Mclean]

Hi,

> Why do you want to set the focus? Wouldn’t different styling be more appropriate?

Not in this case, the focus needs to be set so it’s the default button, that way for instance hitting space bar would select the button.

Thanks,
Justin

[Harbs]

There is no focus bead yet. The simplest/easiest way to get the functionality without a standard bead is to subclass TextButton and add the functionality there. You can probably create an autofocus property and call element.focus() on addedToParent (or something like that).

> On Nov 27, 2017, at 9:32 AM, Justin Mclean <[hidden email]> wrote:
>
> Hi,
>
>> Why do you want to set the focus? Wouldn’t different styling be more appropriate?
>
> Not in this case, the focus needs to be set so it’s the default button, that way for instance hitting space bar would select the button.
>
> Thanks,
> Justin

[Justin Mclean]

Hi,

> There is no focus bead yet. The simplest/easiest way to get the functionality without a standard bead is to subclass TextButton and add the functionality there. You can probably create an autofocus property and call element.focus() on addedToParent (or something like that).

Should I raise an issue for this?

Thanks,
Justin

[Harbs]

You can create an issue for a focus bead if you’d like, but it will probably be a while before I can get to something like that. Too many other things on my plate.

Like I said, it’s pretty easy to work around without a bead.

> On Nov 27, 2017, at 10:14 AM, Justin Mclean <[hidden email]> wrote:
>
> Hi,
>
>> There is no focus bead yet. The simplest/easiest way to get the functionality without a standard bead is to subclass TextButton and add the functionality there. You can probably create an autofocus property and call element.focus() on addedToParent (or something like that).
>
> Should I raise an issue for this?
>
> Thanks,
> Justin

[Justin Mclean]

Hi,

> You can create an issue for a focus bead if you’d like, but it will probably be a while before I can get to something like that.

Raised here:
https://github.com/apache/royale-asjs/issues/93

Thanks,
Justin

[Justin Mclean]

Hi,

>  but it will probably be a while before I can get to something like that. Too many other things on my plate.

No problem I‘ve created one myself. The pull request is here:
https://github.com/apache/royale-asjs/pull/94

Thanks,
Justin