Membuat Dependent Dropdown pada Yii2

Dependent Dropdown adalah input jenis dropdown yang isinya tergantung dari isian dropdown yang lain. Kasus yang mungkin paling sering kita temui adalah ketika menampilkan data kewilayahan. Mungkin kasus ini bisa Anda lihat ketika mau mengisi biodata domisili tempat tinggal, yang meliputi data provinsi dan kabupaten. Oleh karena itu, pada pembelajaran ini kami mengangkat kasus input data wilayah tersebut: provinsi, kabupaten, kecamatan, dan desa/kelurahan.
Untuk data wilayah kita memanfaatkan data wilayah administratif di sini:

https://github.com/edwardsamuel/Wilayah-Administratif-Indonesia

Dari data tersebut kami sudah membuat file migrasinya seperti ini:

Dengan menggunakan keempat file migrasi di atas, Anda tinggal menjalankan perintah di aplikasi konsol seperti berikut:

yii migrate

Selanjutnya, kita buat model melalui fasilitas Gii milik Yii. Akan terbentuk empat buah model sesuai nama tabel, yaitu Provinces, Regencies, Districts, dan Villages. Jika sampai tahap ini tidak ada masalah, lanjutkan membuat controller dan view-nya.

Ini controller-nya

	public function actionDepdrop(){
	return $this->render('depdrop');
	}
	public function actionKab($id)
	{
	$regencies = \app\models\Regencies::find()
	->where(['province_id' => $id])
	->orderBy('id ASC')
	->all();

	if ($regencies) {
	echo "<option> - Pilih Kabupaten -</option>";
	foreach($regencies as $regency) {
	echo "<option value='".$regency->id."'>".$regency->id . " " . $regency->name."</option>";
	}
	} else
	echo "<option>-</option>";

	}
	public function actionKec($id)
	{
	$districts = \app\models\Districts::find()
	->where(['regency_id' => $id])
	->orderBy('id ASC')
	->all();

	if ($districts) {
	echo "<option> - Pilih Kecamatan -</option>";
	foreach($districts as $district) {
	echo "<option value='".$district->id."'>".$district->id." ".$district->name."</option>";
	}
	} else
	echo "<option>-</option>";

	}
	public function actionDesa($id)
	{
	$villages = \app\models\Villages::find()
	->where(['district_id' => $id])
	->orderBy('id ASC')
	->all();

	if ($villages) {
	echo "<option> - Pilih Desa/Kelurahan -</option>";
	foreach($villages as $village) {
	echo "<option value='".$village->id."'>".$village->id." ".$village->name."</option>";
	}
	} else
	echo "<option>-</option>";

	}

view raw SiteController.php hosted with ❤ by GitHub

Dan ini view-nya

	<?php
	use yii\helpers\ArrayHelper;
	use yii\helpers\Html;

	Html::beginForm();


	$provinces = ArrayHelper::map(\app\models\Provinces::find()->asArray()->all(), 'id', 'name');

	echo Html::dropDownList('provinsi', null, $provinces, [
	'prompt' => '-Pilih Provinsi-',
	'onchange' => '$.post("'.Yii::$app->urlManager->createUrl('site/kab').'&id="+$(this).val(), function(data){$("select#kab").html(data);});',
	'class' => 'form-control'
	]);

	echo Html::dropDownList('kabupaten', null, [], [
	'prompt' => 'Pilih Kabupaten',
	'id' => 'kab',
	'onchange' => '$.post("'.Yii::$app->urlManager->createUrl('site/kec').'&id="+$(this).val(), function(data){$("select#kec").html(data);});',
	'class' => 'form-control'
	]);

	echo Html::dropDownList('kecamatan', null, [], [
	'prompt' => 'Pilih Kecamatan',
	'id' => 'kec',
	'onchange' => '$.post("'.Yii::$app->urlManager->createUrl('site/desa').'&id="+$(this).val(), function(data){$("select#desa").html(data);});',
	'class' => 'form-control'
	]);
	echo Html::dropDownList('desa', null, [], [
	'prompt' => 'Pilih Desa/Kelurahan',
	'id' => 'desa',
	'class' => 'form-control'
	]);

	Html::endForm();