drupal7 mutiple select box using ajax callback

Question

I'm trying to create a form using drupal 7 with 4 elements (name,server,version,os,arch)

     function create_server(){
            $form['new_server']['name'] = array(
                '#type' => 'textfield',
                '#title' => t('Name'),
                '#required' => TRUE,
                '#description' => t('Please make sure that your server\'s name is unique.')
            );
            $form['new_server']['os'] = array(
                    '#type' => 'select',
                    '#title' => t('OS'),
                    '#options' => $os,
                    '#multiple' => FALSE,
                    '#required' => TRUE,
                    '#prefix' => '<div id="os-div">',
                    '#suffix' => '</div>',
                    '#ajax' => array(
                        'callback' => 'ajax_server_version_callback',
                        'wrapper' => 'version-div',
                        'method' => 'replace',
                        'effect' => 'fade',
                    ),
                );
    $form['new_server']['version'] = array(
                    '#type' => 'select',
                    '#title' => t('Version'),
                    '#disabled' => TRUE,
                    '#options' => array(),
                    '#ajax' => array(
                        'callback' => 'ajax_server_arch_callback',
                        'wrapper' => 'arch-div',
                        'method' => 'replace',
                        'effect' => 'fade',
                    ),
                    '#required' => TRUE,
                    '#prefix' => '<div id="version-div">',
                    '#suffix' => '</div>',
                );
                $form['new_server']['os_arch'] = array(
                    '#type' => 'select',
                   // '#disabled' => TRUE,
                    '#title' => t('OS_ARCH'),
                    '#options' => array(
                        'x86' => 'x86',
                        'x86_64' => 'x86_64'
                    ),
                    '#multiple' => FALSE,
                    '#required' => TRUE,
                    '#prefix' => '<div id="arch-div">',
                    '#suffix' => '</div>',
                );
return $form;
        }

/**
     * Ajax call for version select form
     * based on the selection.
     */

    function  ajax_server_version_callback($form, &$form_state) {

        $os =  !empty($form_state['values']['os']) ? $form_state['values']['os'] : 'all';
        $catalog = server_get_otib_content();

        if(isset($catalog['version'][$os])){
            $version = $catalog['version'][$os];
        } else {
            $version = $catalog['version'];
        }

        $form['version'] = array(
            '#type' => 'select',
             '#id' => 'edit-version',
            '#title' => t('Version'),
            '#disabled' => TRUE,
            '#options' => $version,
            '#ajax' => array(
                'callback' => 'ajax_server_arch_callback',
                'wrapper' => 'arch-div',
                'method' => 'replace',
                'effect' => 'fade',
            ),
            '#required' => TRUE,
            '#prefix' => '<div id="version-div">',
            '#suffix' => '</div>',
        );


        /* echo '<pre>';
        var_dump($form['version']);
        echo '</pre>'; */
        return $form['version'];

    }

    /**
     *  Ajax call for arch select form
     * @param array $form
     * @param array $form_state
     * @return array
     */
    function ajax_server_arch_callback($form, &$form_state) {
        $os =  !empty($form_state['values']['os']) ? $form_state['values']['os'] : 'all';
        $version =  !empty($form_state['values']['version']) ? $form_state['values']['version'] : 'all';
        $catalog = server_get_otib_content();

        if(isset($catalog['arch'][$os][$version])){
            $version = $catalog['arch'][$os][$version];
        } else {
            $version = $catalog['arch'];
        }

        $form['new_server']['os_arch'] = array(
            '#type' => 'select',
            '#disabled' => TRUE,
            '#title' => t('OS_ARCH'),
            '#options' => array(
                'x86' => 'x86',
                'x86_64' => 'x86_64'
            ),
            '#multiple' => FALSE,
            '#required' => TRUE,
            '#prefix' => '<div id="arch-div">',
            '#suffix' => '</div>',
        );
        return $form['new_server']['os_arch'];
    }

the thing is when i select the first element server, it made the ajax callback correctely and set the version element field. But the version element doesn't do the ajaxcall for setting up the arch select box, even if the #ajax array is set. When i look at the return of the json for the ajax_server_version_callback, it doesn't contain the ajax option. if someone know why it will be very helpfull.

Thx

i don't made change but now it's work, maybe cache or something :/ — Dejora, Sep 17 '13 at 14:26

score 0 · Answer 1 · answered Sep 24 '13 at 12:35

I had the same problem and couldn't google solution. One thing I realized is that ajax callback function doesn't work if element was replaced by ajax and have "disabled" attribute. So you can try something like this:

remove ('#disabled' => TRUE,) attribute

instead add some.js file which disable element by js code

(function($)  {
  $(document).ready(function(){
    $('#element').attr('disabled', 'disabled');
  });
})(jQuery);

It works for me.

drupal7 mutiple select box using ajax callback

1 Answers1