MaskedInput Events

I’m using MaskedInput to format numeric values and this worked fine

echo $form->field(
	$model, 
	"[{$i}]Total",
	[
		'template' => '<div class=\"\">{input}</div>'."\n".'<div class=\"\">{hint}{error}</div>',
	]
)
->label(false)
->widget(
	MaskedInput::className(), [
		'clientOptions' => [
			'alias' => 'decimal',
			'digits' => 2,
			'digitsOptional' => false,
			'radixPoint' => '.',
			'groupSeparator' => ',',
			'autoGroup' => true,
			'removeMaskOnSubmit' => true,
			// 'numericInput' => true,
		],

	]
);

Now, I wanted to add a Focus or Click event

echo $form->field(
		$model, 
		"[{$i}]Total",
		[
			'template' => '<div class=\"\">{input}</div>'."\n".'<div class=\"\">{hint}{error}</div>',
		]
	)
	->label(false)
	->widget(
		MaskedInput::className(), [
			'clientOptions' => [
				'alias' => 'decimal',
				'digits' => 2,
				'digitsOptional' => false,
				'radixPoint' => '.',
				'groupSeparator' => ',',
				'autoGroup' => true,
				'removeMaskOnSubmit' => true,
				// 'numericInput' => true,
			],
			'options'=>[
				'onclick'=>'select();',
			]
		]
	);

By doing so, the layout of the field get all messed up? The event seems to work, but the CSS (I believe) go awry. Am I implement the event(s) improperly? Am I missing something?