Picklist Set default selected with different highlight color

[adnan_salah84]

Hi folks,
I have created Picklist as below:

Code: Select all

	sourceCars = [
        { id: 1, label: 'BMW', value: 'BMW' },
        { id: 2, label: 'Honda', value: 'Honda' },
        { id: 3, label: 'Toyata', value: 'Toyata' }
    ];

    targetCars = [
        { id: 4, label: 'Ford', value: 'Ford' },
        { id: 5, label: 'Lotus', value: 'Lotus' },
    ];

Code: Select all

        <p-pickList [source]="sourceCars" 
                    [target]="targetCars" 
                    sourceHeader="Available"
                    targetHeader="Selected"
                    [sourceStyle]="{'height':'300px'}" 
                    [targetStyle]="{'height':'300px'}">
            <ng-template let-car pTemplate="item">
                <div class="ui-helper-clearfix">
                    <div style="font-size:14px;float:right;margin:15px 5px 0 0">{{car.id}} - {{car.value}}</div>
                </div>
            </ng-template>
        </p-pickList>

For example I want set default selected value by Id 2 (Honda) with Red highlight color in Source pick list box.
Any Idea?
I am waiting for your response.
Thanks in Advance

[sudheer]

You can use the templating feature similar to this https://www.primefaces.org/primeng/#/da ... templating

[adnan_salah84]

What about Selected?

[jtsdev]

Hi Adnan or Sudheer,

Please let us know if you are able to find solution for this scenario on UI.

I have to implement same think, so any help will be helpful