Kartik Select2 options based on table data

Yii 2.0 Extensions
1

I currently have a standard dropDownList in my form

echo $form->field(
	$model, 
	'ContactId',
	[
		'options'=>['class'=>'add-me col-md-offset-1'],
	]
)->dropDownList(
	ArrayHelper::map(ClientsContacts::find()
		->where(['ClientId'=>$model->ClientId])
		->orderBy(['FirstName'=>SORT_ASC, 'LastName'=>SORT_ASC])
		->all(),
		'ContactId',
		'FullName'),
	[
		'prompt'=>'Select a contact ...',
		'onchange'=>'
		$.post("index.php?r=clients-contacts/get-contact-info&id="+$(this).val(), function(data) {
			$("#ContactInfo").html(data);
		});'
	]
)

however, with your guidance, I’m hoping to be able to replace it with the Kartik Select2 (or another extension if another would be more appropriate), that would allow me to have the same list, but style the option classes. The dropdown list contacts, these contacts have an attribute ‘Active’ and I’d like to sort the option so that the Active ones are first in the list and plain, and the Inactive one are at the end of the list and with a class of danger (red). Could anyone help me achieve this?

2

I’ve been trying with the following, but can’t get it quite right, the groupings are wrong.

$clientContactsActive = ArrayHelper::map(ClientsContacts::find()
	->where(['ClientId'=>$model->ClientId])
	->andWhere(['Active'=>1])
	->orderBy(['Active' => SORT_DESC, 'FirstName' => SORT_ASC, 'LastName' => SORT_ASC])
	->all(),
	'ContactId',
	'FullName');
$clientContactsInactive = ArrayHelper::map(ClientsContacts::find()
	->where(['ClientId'=>$model->ClientId])
	->andWhere(['<>', 'Active', 0])
	->orderBy(['Active' => SORT_DESC, 'FirstName' => SORT_ASC, 'LastName' => SORT_ASC])
	->all(),
	'ContactId',
	'FullName');
$clientContacts = [
	$clientContactsActive
];
if(count($clientContactsInactive != 0)){
	array_push($clientContacts, ['Inactive', $clientContactsInactive]);
}

echo $form->field(
	$model, 
	'ContactId',
	[
		'options'=>['class'=>'add-me col-md-offset-1'],
		'labelOptions' => [
			'class'=>'control-label col-md-2 col-md-offset-1'
		],
		'inputOptions' => ['tabindex' => '20'],
	]
)
->widget(Select2::class, [
	'data' => $clientContacts,
	'options' => [
		// 'dir' => 'rtl',
		'placeholder' => 'Select a contact ...',
		'multiple' => false,
	],
	'pluginOptions' => [
		'tags' => false,
		'allowClear' => true,
	],
]);

What I’m hoping to acheive is a list of Active contact with no group header text, a group heading of Inactive followed by a list of inactive contacts with a CSS class of danger if possible.

3

Okay, I’ve got it basically functional, but would still need a hand if it is possible to add danger class to the inactive options.

$clientContactsActive = ArrayHelper::map(ClientsContacts::find()
	->where(['ClientId' => $model->ClientId])
	->andWhere(['=', 'Active', 1])
	->orderBy(['Active' => SORT_DESC, 'FirstName' => SORT_ASC, 'LastName' => SORT_ASC])
	->all(),
	'ContactId',
	'FullName');
$clientContactsInactive = ArrayHelper::map(ClientsContacts::find()
	->where(['ClientId' => $model->ClientId])
	->andWhere(['!=', 'Active', 1])
	->orderBy(['Active' => SORT_DESC, 'FirstName' => SORT_ASC, 'LastName' => SORT_ASC])
	->all(),
	'ContactId',
	'FullName');
if( count($clientContactsInactive) != 0 ){
	$clientContacts = [
		'' => $clientContactsActive,
		'Inactive' => $clientContactsInactive
	];
}else{
	$clientContacts = [
		'' => $clientContactsActive
	];
}
echo $form->field(
	$model, 
	'ContactId',
	[
		'options'=>['class'=>'add-me col-md-offset-1'],
		'labelOptions' => [
			'class'=>'control-label col-md-2 col-md-offset-1'
		],
		'inputOptions' => ['tabindex' => '20'],
	]
)
->widget(Select2::class, [
	'data' => $clientContacts,
	'options' => [
		// 'dir' => 'rtl',
		'placeholder' => 'Select a contact ...',
		'multiple' => false,
	],
	'pluginOptions' => [
		'tags' => false,
		'allowClear' => true,
	],
]);