Here is the tutorial to select city from state id dynamically by using ajax in Yii Framework in 3 easy steps
1) Fetch all state name and state id from "State" table and show it in dropdown field
<?php
$stateList = CHtml::listData(State::model()->findAll(array('order' => 'name')), 'state_id', 'name');
echo $form->dropDownList($model, 'state_id', $stateList, array(
'ajax' => array(
'type' => 'POST', //request type
'url' => CController::createUrl('ajax/getCities'), //url to call.
'update' => '#Address_city_id', //selector to update
'data' => array('state_id' => 'js:this.value'),
)));
?>
Here I have added the 'ajax' array in dropdownlist field where:
- type is type of request i.e. POST/GET
- url is controller and action url to call (Here I have called the AjaxController's getCities() method)
- update is the selector to update i.e. city dropdownlist id
- data is state_id to send request to particular controller/action
This will generate the following HTML output:
<select id="Address_state_id" name="Address[state_id]">
<option value="1">Andaman & Nicobar</option>
<option value="2">Andhra Pradesh</option>
<option value="3">Arunachal Pradesh</option>
.
.
</select>
Here "value" field contains the state id and option name as state names
2) Create city dropdown field
<?php
echo $form->dropDownList($model, 'city_id');
?>
This will generate the following HTML output:
<select id="Address_city_id" name="Address[city_id]">
<option value="1">Kolhapur</option>
<option value="2">Ahmednagar</option>
.
.
</select>
3) In controller i.e AjaxController -> actionGetCities() method
<?php
class AjaxController extends Controller {
public function actionGetCities() {
//Fetch all city name and id from state_id
$data = City::model()->findAll('state_id=:id', array(':id' => (int) $_POST['state_id']));
//Passing city id and city name to list data which generates the data suitable for list-based HTML elements
$data = CHtml::listData($data, 'city_id', 'name');
//CHtml::tag which generates an HTML element
foreach ($data as $value => $name) {
echo CHtml::tag('option', array('value' => $value), CHtml::encode($name), true);
}
}
}
?>
Thats it! Hope this will help you.