0

First I want to select State (like Tamil Nadu, Sikkim, Kerala) after selecting state, depended city list will be display another dropdown list ( for example Tamil Nadu -> Chennai, Salem, Karur and Kerala -> Trivandrum, Kochin etc)

Please help me please how to make it, here i have tried some coding but does not work, Please help me

Sstate - Table

$query_state = db_select('state', 's');
$query_state->fields('s',array('State_code','State_name'));
$query_state->orderBy('State_name','ASC');
$state_results = $query_state->execute();
$options_state = array();

foreach($state_results as $state_record) {
  $options_state[$state_record->State_code]=t($state_record->State_name);
}

$form['state'] = array(
  '#type' => 'select',
  '#title' => t('State'),
  '#options' => $options_state,
  '#required' => TRUE,
);

City - Table

$query_city=db_select('city', 'c');
$query_city->fields('c',array('District_Code','District_Name'));
$query_city->condition('State_Code','$state_record->State_code','=');
$query_city->orderBy('District_Name','ASC');
$city_results = $query_city->execute();
$options_city = array();

foreach($city_results as $city_record) {
  $options_city[$city_record->District_code]  =t($city_record->District_Name);
}

$form['city'] = array(
  '#type' => 'select',
  '#title' => t('District'),
  '#options' => $options_city,
  '#required' => TRUE,
  '#states' => array(
    'visible' => array(
      ':input[name="state"]' => array('value' => $options_state)
    )
  )
);
1
  • Can you give us your form declaration ($form['state'] and $form['city']) ? Jan 11 '13 at 12:14
1

Basically, in your form declaration, you have to add

In your form['state'] :

'#ajax' => array(
  'callback' => '_ajaxfunction',
  'wrapper' => 'divaroundseconddropdown'
);

Then in your form['town'] :

'#prefix' => '<div id="divaroundseconddropdown">',
'#suffix' => '</div>',

Now in your _ajaxfunction :

function _ajaxfunction($form, $form_state) {
  return $form['city'];
}

Now, back to your form['town'], you simply have to build your $options with the $form_state['values']['state'] variable, which will contain what has been filled in the first dropdown.

Everything is documented here.

[EDIT]

First replace $state_record in your $query_city by $form_state['values']['state']; *You can check if the value is formatted the right by dpm($form_state); in your _ajaxfunction.

Then :

$form['state']= array(
  '#type' => 'select',
  '#title' => t('State'),
  '#options' =>$options_state,
  '#required' => TRUE,
  '#ajax' => array(
    'callback' => '_ajaxfunction',
    'wrapper' => 'divaroundseconddropdown'
  ),
);


$form['city']= array(
  '#type' => 'select',
  '#title' => t('District'),
  '#options' => $options_city,
  '#prefix' => '<div id="divaroundseconddropdown">',
  '#suffix' => '</div>',
  '#required' => TRUE,
  '#states'=>array(
    'visible'=>array(
      ':input[name="state"]' => array(
        'value'=>$options_state))));

Close your function, open a new one :

function _ajaxfunction($form, $form_state) { return $form['city']; }

7
  • i am new to drupal, can u modify my coding and post it? Jan 11 '13 at 13:43
  • i edited my answer. Jan 11 '13 at 13:56
  • thanks for reply, but the city values not fetching from database. its shows empty, now what can i do? Jan 11 '13 at 14:22
  • in _ajaxfunction do a dpm($form_state);, we have to check if the value is well formatted. Jan 11 '13 at 14:38
  • i just put in ajaxfunction the following coding only function _ajaxfunction($form, $form_state) { return $form['city']; } Jan 11 '13 at 14:43
-2

You can try the following,

$form['state'] = array(
    '#type' => "select",
    '#options' => $category,
    '#name' => "category",
    '#attributes' => array(
        'onchange' => 'getCategory(this);',
     ),
    '#id'   => "state",
    '#default_value'=> $cat_default,
    '#prefix' => '',
);
$form['city'] = array(
    '#type' => "select",
    '#options' => $skillset,
    '#name' => "skillset",
    '#id'   => "city",
    '#default_value'=> $skil_default,
    '#prefix' => '',
);

Using the onclick getCategory(this) function you can fetch the city corresponding to the state using AJAX and add to the second field i.e. city using javascipt

document.getElementById("city").innerHTML = result;

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.