使用 TextField 值设置 DropDown 的选项答案

【问题标题】：Set the options of DropDown with TextField value使用 TextField 值设置 DropDown 的选项
【发布时间】：2012-06-25 10:43:29
【问题描述】：

我想要一个启用/禁用文本字段的复选框。启用复选框和文本字段后，获取文本字段的值并相应地设置下拉选项的数量，

例如：如果文本字段的值为 4，则下拉选项应为 1 2 3 4。

我有以下代码。请帮我解决它，谢谢。

Cakephp 表单

echo $this->Form->checkbox('custom_lvl_def', array('hiddenField' =>       false,'OnClick'=>"enable_disable()"));
echo "Use custom level definitions"."&nbsp";
echo $this->Form->input('alternative_no_of_levels', array('style'=>'width:70px','label'=>'levels','div'=>false, 'disabled'=>TRUE));
echo "<br>";

echo $this->Form->input('dropdown', array(
  'options'=>$options,
  'empty' => 'Select Level',
  'label'=>'Type:',
  'selected'=>'Select Level',
  'style'=>'width:130px',
  'div'=>false
));

JavaScript 函数

function enable_disable()
{        
    if($('#CompetenceCustomLvlDef').attr('checked'))
        {               
            $('#CompetenceAlternativeNoOfLevels').removeAttr("disabled");
            // var $a=array ('Level');
            var value = $('#CompetenceAlternativeNoOfLevels').val();
            for ( var i = 0; i < value; i++ ) {
                $('#CompetenceDropdown').options[i].selected = i;           
            return; }           
        }
    else                 
            $('#CompetenceAlternativeNoOfLevels').attr('disabled', true);

}

【问题讨论】：

选择（下拉）中的值和文本字段是否限制了显示的数量，或者它们是否按照您在问题中的建议生成？选择选项是否有任何数据源？
在需要 javascript 帮助时发布源代码 html，而不是 php
文本字段的限制是 1-9，我们在文本字段中选择 1-9 之间的值也应该是选项的数量，因为我想返回它们

标签： javascript jquery cakephp-1.3

【解决方案1】：

这可能会帮助您获取您输入的级别数的下拉列表数组。根据问题，您可以在表单中尝试这个..

echo $this->Form->checkbox('custom_lvl_def', array('hiddenField' => false,'id'=>'id_custom_lvl_def', 'onclick'=>"javascript:enable_disable()"));
echo "Use custom level definitions"."&nbsp";
echo $this->Form->input('alternative_no_of_levels', array('style'=>'width:70px','id'=>'id_alternative_no_of_levels','label'=>'levels','onblur'=>'javascript:enable_disable();', 'div'=>false, ));
echo "<br>";
echo $this->Form->input('dropdown', array(
  'options'=>'',
  'empty' => 'Select Level',
  'label'=>'Type:',
  'type'=>'select',
  'id'=>'id_dropdown',
  'name'=>'dropdown',
  'style'=>'width:130px',
  'div'=>false
));

在脚本中：

function enable_disable()
{        
    $("#id_dropdown").empty();
    if($('#id_custom_lvl_def').attr('checked'))
    {               
        $('#id_alternative_no_of_levels').removeAttr("disabled");
        var value = $('#id_alternative_no_of_levels').val();
        var optionsAsString = "";
        optionsAsString += "<option value=''>" + "Select Level" + "</option>";
        for ( var i = 1; i <= value; i++ ) {
            optionsAsString += "<option value='" + i + "'>" + i + "</option>";
        }           
        $( 'select[name="dropdown"]' ).append( $( optionsAsString ) );
    }
    else                 
        $('#id_alternative_no_of_levels').attr('disabled', true);
}

【讨论】：