cakephp Ajax: city select box not populating when state is selected - ajax

Question

I'm trying to populate the city select box based on the selected state (which is also a select box) using Ajax. When i select state, the city select box is not being populated.
There are 5 models below: Student, MerryParent, MerryClass, State, City. All of them are related to one another.
Can someone please tell me on what am I doing wrong? thank you.
The following are the models:
student.php
<?php
class Student extends appModel{
var $name='Student';
var $belongsTo=array('MerryParent','State','City','MerryClass');
}
?>
merry_parent.php
<?php
class MerryParent extends appModel{
var $name='MerryParent';
$hasMany=array(
'Student'=>array(
'className'=>'Student',
'foreignKey'=>'merry_parent_id'
)
);
$belongsTo=array('State','City','MerryClass');
?>
merry_class.php
<?php
class MerryClass extends AppModel{
var $name='MerryClass';
var $hasMany=array
('Student'=>array(
'className'=>'Student',
'foreignKey'=>'class_id'
),
'MerryParent'
);
var $belongsTo=array('State','City');
//var $displayField='class_name';
}
?>
city.php
<?php
class City extends AppModel{
var $name='City';
var $belongsTo='State';
var $hasMany=array('MerryParent','MerryClass',
'Student'=>array(
'className'=>'Student',
'foreignKey'=>'city_id'
)
);
}
?>
state.php
<?php
class State extends AppModel{
var $name='State';
var $hasMany=array(
'MerryParent',
'MerryClass',
'City'=>array(
'className'=>'City',
'foreignKey'=>'state_id'
//'dependent'=>true
),
'Student'=>array(
'className'=>'Student',
'foreignKey'=>'state_id'
)
);
}
?>
The controllers
students_controller.php
<?php
class StudentsController extends AppController{
var $name='Students';
var $helpers = array('Html','Form','Ajax','Javascript');
var $components=array('RequestHandler');
function getcities(){
$options=$this->Student->City->find('list',
array
('conditions'=>array(
'City.state_id'=>$this->data['Student']['state_id']
),
'group'=>array('City.name')
)
);//closing parentheses for find('list'...
$this->render('/students/ajax_dropdown');
}
function add(){
if (!empty($this->data)){
/*var_dump($this->data);
die(debug($this->Student->validationErrors)); */
$student=$this->Student->saveAll($this->data,array('validate'=>'first'));
if (!empty($student))
{
$this->Session->setFlash('Your child\'s admission has been received. We will send you an email shortly.');
$this->redirect(array('controller'=>'pages', 'action'=>'home'));
}
} //for if (!empty....
$states=$this->Student->State->find('list');
$cities=array();
$this->set(compact('states','cities'));
}//end function
}
?>
merry_parents_controller.php
<?php
class MerryParentsController extends AppController{
var $name='MerryParents';
}
?>
add.ctp
<?php
echo $javascript->link('prototype',false);
echo $form->create('Student');
echo '<fieldset>';
echo '<legend>Student Information</legend>';
echo $form->input('Student.name');
$options = array('Male'=>'Male','Female'=>'Female');
$attributes = array('value'=>'Male');
echo $form->radio('Student.gender',$options,$attributes);
echo $form->input('Student.dob', array('label'=>'Date of Birth',
'dateFormat'=>'DMY',
'empty'=>true,
'timeFormat' => '',
'minYear' => (
date('Y') - 5
),
'maxYear' => (
date('Y') - 2
)
));
echo $form->input('Student.class_id',
array(
'label'=>'Enquiry Class for',
'empty'=>'Choose one',
'options'=>array('1'=>'Playgroup','2'=>'Nursery','3'=>'LKG', '4'=>'UKG')
)
);
echo '</fieldset>';
echo '<fieldset>';
echo '<legend>Parent Information</legend>';
//echo $form->input('Student.parent_id', array('type'=>'hidden'));
echo $form->input('MerryParent.initial',
array('empty'=>true,
'options'=>array('Dr'=>'Dr',
'Mr'=>'Mr',
'Mrs'=>'Mrs',
'Ms'=>'Ms')
)
);
echo $form->input('MerryParent.name', array('label'=>'Parent/Guardian Name'));
echo $form->input('MerryParent.email');
echo $form->input('MerryParent.landline');
echo $form->input('MerryParent.mobile');
echo $form->input('MerryParent.address');
echo $form->input('Student.state_id');
echo $form->input('Student.city_id');
echo $form->input('MerryParent.postal_code');
$options = array('url' => 'getcities', 'update' => 'StudentCityId');
echo $ajax->observeField('StudentStateId', $options); //observes the drop down
changes in state id and makes an xmlHttpRequest when its contents have changed.
echo '</fieldset>';
echo $form->end('Submit');
?>
ajax_dropdown.ctp
<?php foreach($options AS $k=>$v) : ?>
<option value="<?php echo $k; ?>"><?php echo $v; ?></option>
<?php endforeach; ?>

Answer 1

You don't need to put 0 in Model name and field, since you are saving just one student in a form. Try using Student.name instead of Student.0.name and so on for all fields. Also try to test with $validate => false if it saves then.