如何使用 jQuery 在 Drupal 6 中创建动态表单？

Question

我有一个 Drupal 表单，当然是用 PHP 编写的，它有两个选择器。第一个是 Drupal 主题列表，第二个是可用区域列表。 In Drupal, certain themes have certain regions which are available to put blocks into so when a theme is chosen, I want the region selector to be populated by the available options associated to the selected theme.

我希望我的 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);

它确实会提醒“测试”。

希望我问对了，谢谢:)

Answer 1

嗯，我想通了！所以我想在这里与其他想知道的人分享我的结果。

函数 drupal_add_js 将 javascript 直接添加到页面的输出中。您可以使用它来设置变量，就像您在使用 javascript 编码时直接执行的操作一样。

这是我的模块中的 php 代码，它添加了 javascript 以及我的名为“simple_block_selector.js”的 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])); 
        }
});

});

如果您不知道选择器的 id，您可以转到您的页面并右键单击“查看源代码”以查看它们作为 id 给出的内容。

这就是它的全部内容！我确实让模块还检查表单的当前值是基于块的 id 的，并将这些设置为表单上的默认值。它还查找与块的默认主题关联的区域，并在页面首次显示时显示它们。我会粘贴完整的代码，但我觉得没有必要，因为这些部分解释了我是如何回答我的问题的。