<p-selectButton> default option

[Zoopers]

I'm using a simple select button to set a boolean value for an object I'm passing to my API. I want to find out how to set one of the options to be selected by default when the user access the page. Can someone maybe help? I can do the simple checking in code and pass a default value to the API if the user doesn't explicitly specify one, but I'd like the Yes to be colored blue by default, even if the user doesn't click on an option.

Does anyone know how this works? The page makes mention of being able to set a default option but doesn't mention how that is done.

[alexey93]

It is easier than you think:

ts

maps: SelectItem[];
map: number = 1;
;
constructor() {


this.maps = [];

this.maps.push({ label: '1', value: 1 });
this.maps.push({ label: '2', value: 2 });
this.maps.push({ label: '3', value: 3 });
this.maps.push({ label: '4', value: 4 });
}

html

Code: Select all

 <p-selectButton  [(ngModel)]="map" [disabled]="check_fixed" [options]="maps" name="Map"></p-selectButton>
 

this will set the default map to "1", and the button will be clicked.

[Zoopers]

Thanks, much appreciated! Can't believe the solution was that simple.

I was using a SelectItem and setting it equal to the first element in the array in the constructor. Every day I just realise how much I have left to learn.

[alexey93]

Thanks, much appreciated! Can't believe the solution was that simple.

I was using a SelectItem and setting it equal to the first element in the array in the constructor. Every day I just realise how much I have left to learn.

You are welcome!

You have to be carefull thogh, map can be anything in my example, in that case you will not see its value in the selectbutton. Just make sure to only set map to available values, and do not accept any of the others. For example you can set map=0, and when you send the value of the map variable to someone, he will recieve 0 (and not nothing, or null). Sometimes it is not what you want, if you have a selectbutton, in most cases you must choose one of the options (in your case it is like this, and will work fine).

[ikuriel]

Not working for boolean, same example but ussing boolean values, only 2 options.

[Darkweaver]

Hello. Can you give a simple example of this using reactive forms and having multiple="true"? Selected values should be an array. Need help on this, thanks!