Как мне создать динамическую форму в Drupal 6, используя jQuery? - PullRequest
1 голос
/ 26 июля 2011

У меня есть форма Drupal, написанная на PHP, конечно, с двумя селекторами. Первая содержит список тем Drupal, а вторая - список доступных регионов. В Drupal определенные темы имеют определенные регионы, в которые можно поместить блоки, поэтому при выборе темы я хочу, чтобы селектор регионов заполнялся доступными опциями, связанными с выбранной темой.

Я хочу, чтобы мой javascript-файл использовал jQuery для прослушивания селектора тем, чтобы при изменении он обновлял селектор регионов.

У меня есть модуль PHP, настроенный таким образом, что существует двумерный массив значений, такой что array ['theme'] = array () возможных значений области. Как это:

Array
(
[garland] => Array
    (
        [left] => left
        [] => 
        [right] => right
    )

[zen] => Array
    (
        [] => 
        [sidebar_first] => sidebar_first
        [sidebar_second] => sidebar_second
    )
)

Что делается с помощью этого кода:

$themeQuery = db_query('SELECT DISTINCT theme from {blocks}');
    while($row = db_fetch_object($themeQuery)){ 
        $regionQuery = db_query('SELECT DISTINCT region from {blocks} WHERE theme="%s"',$row->theme);
     while($regions = db_fetch_object($regionQuery)){
        $regionOptions[$row->theme][$regions->region] = $regions->region;
     }
     $themeOptions[$row->theme] = $row->theme;
  }

А вот форма:

$form = array();
 $form['title'] = array(
     '#type'    => 'markup',
     '#value'   => '<br/><h4>Update block: <strong>'.$module.': '.$delta.'</strong></h4>'
  );
 $form['theme'] = array(
    '#title'            => 'Theme',
    '#type'             => 'select',
    '#options'          => drupal_map_assoc($themeOptions),
    '#default_value'            => $currentTheme,
  );
  $form['region'] = array(
    '#title'            => 'Region',
    '#type'             => 'select',
    '#options'          => array(''),
    '#default_value'    => $currentRegion,
  );

Все, что мне действительно нужно сделать, это вставить двумерный массив $ regionOptions в javascript! Я пробовал drupal_to_js и drupal_add_js, но это не сработало!

Javascript таков:

$(document).ready(function(){
    $('#edit-theme').change(function(){
        alert(Drupal.settings.regions[$(this).val()]);
    });
    });

Вот моя попытка drupal_add_js (в коде PHP):

drupal_add_js(array('regions' => $regionOptions),'setting');

Эта функция работает, если я пытаюсь сделать:

drupal_add_js(array('regions' => 'test'),'setting');

А затем позвоните в JavaScript:

alert(Drupal.settings.regions);

Оповещение «тест».

Надеюсь, я правильно спросил, спасибо:)

1 Ответ

0 голосов
/ 26 июля 2011

Ну, я понял это!Поэтому я хотел бы поделиться своими результатами здесь для всех, кто хочет знать.

Функция drupal_add_js добавляет javascript непосредственно к выводу вашей страницы.Вы можете использовать его для настройки переменных, как если бы вы кодировали в javascript.

Вот мой php-код в моем модуле, который добавляет javascript вместе с моим JS-файлом под названием 'simple_block_selector.js'который находится в том же каталоге.

// creates outside array
   drupal_add_js("var regions = new Array();",'inline');  
   foreach($regionOptions as $t=>$theme){
        // creates new array for within regions array
        drupal_add_js("var ".$t."= new Array();",'inline');
        drupal_add_js("regions['".$t."']=".$t.";",'inline');
        $counter = 0;
        foreach($theme as $region){
            if($region != ''){
                drupal_add_js("regions['".$t."']['".$counter."'] = '".$region."';",'inline');
            }
            else{
                drupal_add_js("regions['".$t."']['".$counter."'] = 'none';",'inline');
            }
            $counter++;
        }
   }
  drupal_add_js(drupal_get_path('module','simple_block').'/simple_block_selector.js');

Как вы можете видеть в коде, вы просто используете drupal_add_js и затем набираете все, что обычно в javascript, используя кавычки ("").Когда вам нужно передать переменные PHP в него, вы используете конкатенацию (используя «.» Между строками и переменными), чтобы присоединить его.Если он был пустым, я назначил ему «нет», чтобы пользователь мог лучше понять выбор.«Inline» указывает, что скрипт должен быть встроен.

А затем в моем файле javascript я сначала удалил все опции во втором селекторе.Затем он выбирает конкретный массив регионов на основе выбранной темы.И затем он анализирует этот массив, добавляя каждое значение к другому селектору, например так:

$(document).ready(function(){
$('#edit-theme').change(function(){
    $('#edit-region').find('option').remove();
    for(var i=0; i<regions[$(this).val()].length;i++)
        {
            $('#edit-region').append($('<option>').text(regions[$(this).val()][i])); 
        }
});

});

Если вы не знаете идентификатор ваших селекторов, вы можете перейти кнажмите на свою страницу и щелкните правой кнопкой мыши, чтобы «просмотреть исходный код», чтобы увидеть, что им присвоено в качестве идентификатора.

Вот и все!У меня есть модуль, также проверяющий, какие текущие значения формы основаны на идентификаторе блока, и он устанавливает их как значения по умолчанию в форме.Он также находит регионы, связанные с темой блока по умолчанию, и отображает их при первом показе страницы.Я вставил полный код, но мне показалось, что в этом нет необходимости, поскольку в этих разделах объясняется, как я ответил на мой вопрос.

...