アイテムリストとajaxを使ったDrupal expandableツリー

Question

私はアイテムリストとAjax（jsTreeに似ています）を使って拡張可能なツリーを作ろうとしています。

私はJava Scriptを使用してこれを解決する方法を知っていますが、drupalsフォーム、テーマ、およびAjaxコールバックのみを使用して解決できるかどうかを確認したいと考えました。

私の問題は、ajaxコールバックを機能させてサブリストにロードできないことです。これまで私がこれまで出てきたことは次のとおりです。

<?php 

function ajax_tree_list_menu() 
{ 
    $items = array();  
    $items['ajax_tree_list'] = array(
     'title'   => 'Ajax Tree List', 
     'description'  => 'Tree List only using ajax and themes(No js file)', 
     'page callback' => 'drupal_get_form', 
     'page arguments' => array('ajax_tree_list_form'), 
     'access callback' => array(TRUE), 
     'type'   => MENU_CALLBACK, 
    ); 

    return $items; 
} 

function ajax_tree_list_theme() 
{ 
    return array('tree_list_items' => array('render element' => 'form')); 
} 

function ajax_tree_list_form($form, &$form_state) 
{ 
    $Items = array(
     'Item 1' => array('Item 1.1', 'Item 1.2', 'Item 1.3'), 
     'Item 2' => array('Item 2.1', 'Item 2.2', 'Item 2.3'), 
     'Item 3' => array('Item 3.1', 'Item 3.2', 'Item 3.3'), 
     'Item 4' => array('Item 4.1', 'Item 4.2', 'Item 4.3'), 
    ); 

    $form['tree_list'] = array 
    (
     '#tree' => true, 
     '#theme' => 'tree_list_items', 
    ); 

    foreach($Items as $key => $value) 
    { 
     $form['tree_list'][$key]['data'] = array(
      '#type' => 'value', 
      '#value' => $key, 
     ); 

     $form['tree_list'][$key]['button'] = array(
      '#type' => 'button', 
      '#name' => $key, 
      '#ajax' => array(
       'callback' => 'ajax_update_sub_tree_list_callback', 
       'wrapper' => $key, 
       'method' => 'replace', 
       'effect' => 'fade', 
      ), 
      '#value' => t('+'), 
     ); 

     $form['tree_list'][$key]['sub'] = array(
      '#theme' => 'item_list', 
      '#items' => $value, 
     ); 
    } 

    return $form; 
} 

function theme_tree_list_items($variables) 
{ 
    $form = $variables['form']; 

    $items = array(); 
    foreach (element_children($form) as $key) { 
     $div_to_replace = '<div id="' . $form[$key]['data']['#value'] . '">Put sub list here</div>'; 
     $name = $form[$key]['data']['#value']; 

     $items[] = array(
      'data' => drupal_render($form[$key]['button']) . $name . $div_to_replace 
     ); 
    } 

    $output = theme('item_list', array('items' => $items)); 

    return $output; // . drupal_render_children($form); 
} 

function ajax_update_sub_tree_list_callback($form, $form_state) 
{ 
    return $form['tree_list'][$form_state['triggering_element']['#name']]['sub']; 
} 

これはサブリストにロードするために達成したいことです。 tree list built with only forms and ajax

これは、私はそれを見てみたい方法です：

Answer 1

それは私の自己を動作しませんでした、なぜ私が見つけました。

問題は、ID属性にスペースがあり、HTMLの有効なID属性ではありませんでした。

$form['tree_list'][$key]['button'] = array(
    '#type' => 'button', 
    '#name' => $key, 
    '#ajax' => array(
     'callback' => 'ajax_update_sub_tree_list_callback', 
     // Have added str_replace() on next line to replace all space with underscore 
     'wrapper' => str_replace(' ', '_', $key), 
     'method' => 'replace', 
     'effect' => 'fade', 
    ), 
    '#value' => t('+'), 
); 

はtheme_tree_list_items（...）

foreach (element_children($form) as $key) 
{ 
    // Have added str_replace() on next line to replace all space with underscore 
    $div_to_replace = '<div id="' . str_replace(' ', '_', $form[$key]['data']['#value']) . '">Put sub list here</div>'; 
    $name = $form[$key]['data']['#value']; 

    $items[] = array(
     'data' => drupal_render($form[$key]['button']) . $name . $div_to_replace 
    ); 
} 

を更新しました：I私はIDとしてタイトルを使用するすべての場所に追加したstr_replace（」」、 '_'、）それを修正する