Yii2 dropdown2 selected depending on dropdown1 - yii2

Question

I have two standard dropdowns:
$form->field($model, 'typ_id')->dropDownList(
\yii\helpers\ArrayHelper::map(app\models\Plra::find()->all(), 'id', 'name'),
);
and
$form->field($model, 'tol_id')->dropDownList(
\yii\helpers\ArrayHelper::map(app\models\Plratol::find()->all(), 'id', 'name')
);
and I would like to make one certain value selected (virtually as a suggestion, as a default) in dropdown tol_id if one certain typ_id value is selected. Basically the two dropdowns are independent. As a workaround to achieve what I want, I can make it work as a dependent dropdown:
$form->field($model, 'typ_id')->dropDownList(
\yii\helpers\ArrayHelper::map(app\models\Plra::find()->all(), 'id', 'name'), [
'onchange' => '$.post("' . \Yii::$app->urlManager->createUrl('plra/listtol?typ_id=') . '"+$(this).val(), function(data) {$("select#tol_id").html(data);});',
]
);
and
$form->field($model, 'tol_id')->dropDownList(
\yii\helpers\ArrayHelper::map(app\models\Plratol::find()->all(), 'id', 'name'), [
'id' => 'tol_id'
]
);
Controller:
public function actionListtol($typ_id) {
if ($typ_id == 2) {
$plratol = Plratol::find()->where(['typ_id' => 2])->one();
echo "<option value='" . $plratol->id . "'>" . $plratol->name . "</option>";
} else {
$plratols = Plratol::find()->where(['typ_id' => NULL])->all();
echo "<option>Select</option>";
foreach ($plratols as $plratol) {
echo "<option value='" . $plratol->id . "'>" . $plratol->name . "</option>";
}
}
}
but I'm wondering is there a more simple way maybe mit js for such a simple dependency/scenario? If yes, can you please provide me sample code 'cause unfortunately js is not something I'm familiar with.
I would like to solve it without Kartik's DepDrop extension.

Answer 1

You can use pure javascript or jquery,
Add an onchange() event on 1st dropdown and using ajax in onchange() function get the required value of 2nd dropdown and set its html.

Answer 2

Although you don't have any code to reference. If I understand correctly, your dependent dropdown won't work onload if you pass it a selected value. You can still get around this with JS.
$( document ).ready( function(){
e = $('#parent'); // replace with your elements name
e.change();
});
The above code will trigger the change event and whatever value you have provided will be used in the dependent dropdown.