#ajax DRUPAL 7的动态下拉列表

时间:2012-02-23 07:24:32

标签: ajax

我试图通过drupal 7的#ajax属性进行动态3下拉(DD).. 第一个DD包含国家/地区列表(来自db) 第二个DD包含状态列表(来自db) 3re DD包含城市列表(来自db)

问题是因为我选择国家..我的状态DD显示状态相应..如何触发我的状态DD,以便我的城市DD也更新同时我的状态更新..我必须点击状态表只有那时我的城市DD才会改变..

--- FORM_ALTER中的我的代码就是这个---

$options_first = iripple_classifieds_country_list();


   $selected = isset($form_state['values']['country_by_alter']) ? $form_state['values']['country_by_alter']: key($options_first);
   $options_first = iripple_classifieds_country_list();
    $form['country_by_alter'] = array(
      '#type' => 'select',
      '#title' => t('Country'),
        '#validated' => TRUE,
      '#options' => $options_first,
      '#weight' => 5,
        //'#disabled' =>TRUE,
      '#ajax' => array(
          'callback' => 'iripple_classifieds_country_callback',
          'wrapper' => 'statereplace',
          'effect' => 'fade',
         // 'event' => 'onload'
      ),
        '#attributes' => array(
          //  'onload' => "jQuery('#edit-country-by-alter').trigger('click')"
        )

  );
    $options_second = iripple_classifieds_state_list();
    $selected_state = isset($form_state['values']['state_by_alter']) ? $form_state['values']['state_by_alter']: key($options_second);
    $form['state_by_alter'] = array (
      '#type' => 'select',
        '#title' => t('State'),
        '#options' => iripple_classifieds_selected_states($selected),
        '#default_value' => isset($form_state['values']['state_by_alter']) ? $form_state['values']['state_by_alter']:'',
        '#weight' => 7,
        '#validated' => TRUE,
        '#prefix' => '<div id="statereplace">',
        '#suffix' => '</div>',
        '#ajax' => array(
            'callback' => 'iripple_classifieds_state_callback',
            'wrapper' => 'cityreplace',
            'event' => 'change'
        )
    );

    $form['city_by_alter'] = array(
        '#type' => 'select',
        '#title' => t('City'),
        '#options' => iripple_classifieds_selected_cities($selected_state),
        '#default_value' => isset($form_state['values']['city_by_alter']) ? $form_state['values']['city_by_alter']:'',
         '#weight' => 8,
        '#validated' => TRUE,
        '#prefix' => '<div id="cityreplace">',
        '#suffix' => '</div>',
    );

2 个答案:

答案 0 :(得分:0)

根据我过去的尝试,除非您没有使用字段模块,否则Hierarchial Select模块与您自定义模块基于所包含的hs_smallhierarchy或hs_taxonomy模块/选择菜单将适用于您的三级选择元件。

hs_taxonomy模块具有您需要的数据库调用,否则您只需传递信息并使用前者即可。我搜索了很多不同的网站,这是我试图在一段时间内完成的事情。查看他们的代码会向您显示您必须使用的Javascript并处理第二和第三个选择项目,因为如您所述,除非没有说明一个页面加载,否则您将遇到问题。

我已经获得了6级Ebay类别来正确更改选项,但在某个级别后它不会更新$ form_state。

答案 1 :(得分:0)

function ajax_pra_menu() { $items['ajax_pra'] = array(enter code here
    'title' => 'ajax Practice',
    'page callback' => 'drupal_get_form',
    'page arguments' => array('ajax_pra_dependent_dropdown'),
    'access callback' => TRUE,enter code here` );

return $items;
}

function ajax_pra_dependent_dropdown($form, &$form_state) { $options_first = _ajax_pra_get_first_dropdown_options();

$options_two = _ajax_pra_get_second_dropdown_options();

$selected = isset($form_state['values']['dropdown_first']) ? $form_state['values']['dropdown_first'] : key($options_first);

$select_two = isset($form_state['values']['dropdown_second']) ? $form_state['values']['dropdown_second'] : key($options_two);

$form['dropdown_first'] = array(   
   '#title' => 'Item',
   '#type' => 'select',
   '#options' => $options_first,
   '#default_value' => $selected,
   '#ajax' => array(
     'callback' => 'ajax_pra_dependent_dropdown_callback',
     'wrapper' => 'dropdown-second-replace'
    ),
 );

 $form['dropdown_second'] = array(
   '#title' => $options_first[$selected] . ' ' . t('type'),
   '#type' => 'select',
   '#prefix' => '<div id="dropdown-second-replace">',
   '#suffix' => '</div>',
   '#options' => _ajax_pra_get_second_dropdown_options($selected),
   '#default_value' => isset($form_state['values']['dropdown_second']) ?   $form_state['values']['dropdown_second'] : '',
   '#ajax' => array(
      'callback' => 'ajax_pra_two_dependent_dropdown_callback',
      'wrapper' => 'dropdown-third-replace',
    ),
  );

  $form['dropdown_third'] = array(
     '#title' => $options_two[$select_two] . ' ' . t('third'),
     '#type' => 'select',
     '#prefix' => '<div id="dropdown-third-replace">',
     '#suffix' => '</div>',
     '#options' => _ajax_pra_get_third_dropdown_options($select_two),
     '#default_value' => isset($form_state['values']['dropdown_third']) ? $form_state['values']['dropdown_third'] : '',
    );

  $form['submit'] = array(
     '#type' => 'submit',
      '#value' => t('save'),
  );
}

 function ajax_pra_dependent_dropdown_callback($form,$form_state)
{
    return $form['dropdown_second'];
}

function ajax_pra_two_dependent_dropdown_callback($form,$form_state)
{
   return $form['dropdown_third'];
}

function _ajax_pra_get_first_dropdown_options()
{
 return drupal_map_assoc(
    array(
        t('Car'),
        t('Bike'),
        t('Mobile'),
    )
 );
}
 function _ajax_pra_get_second_dropdown_options($key = ' ')
    {
        $options = array(
            t('Car') => drupal_map_assoc(
               array(
                    t('bmw'),
                    t('audi'),
                )
            ),
            t('Bike') => drupal_map_assoc(
              array(
                    t('honda'),
                    t('suzuki'),            
                )
            ),
            t('Mobile') => drupal_map_assoc(
                array(
                    t('nokia'),
                    t('micro'),
                )
            ),
        );


        if (isset($options[$key]))
        {
            return $options[$key];
        }
        else{
            return array();
        }
    }

    function _ajax_pra_get_third_dropdown_options($key = '')
    {
        $options = array(
            t('bmw') => drupal_map_assoc(
                array(
                    t('bmw x3'),
                    t('bmw x6'),
                )
            ),
            t('honda') => drupal_map_assoc(
                array(          
                    t('city'),
                    t('accord'),
                )
            ),
        );

        if(isset($options[$key]))
        {
            return $options[$key];
        }
        else
        {
            return array();
        }
    }