如何使第二个下拉隐藏/取消隐藏第一个下拉选项?

时间:2014-04-28 10:42:38

标签: php ajax drop-down-menu yii x-editable

如果所选项目是第一个下拉菜单的第一个选项,我有关于使第二个下拉列表隐藏/取消隐藏的问题。由于这更像是前端,我认为我使用AJAX。

我正在使用X-editable小部件,这里是代码:

<div class="control-group">
    <label class="control-label" for="category">大カテゴリ</label>
        <div class="controls">
        <?php
            $criteria = new CDbCriteria;
            $criteria -> condition = 'parent_id=:parent_id AND school_id=:school_id AND status=:status';
            $criteria -> params = array(':parent_id' => 0, ':school_id' => $school_account_info -> id, ':status' => 'active');
        ?>

        <?php
            $this->widget('editable.EditableField', array(
                'id'        => 'drop', //ADDED THIS LINE SO I COULD GET THE SELECTED VALUE BUT I GUESS I'M WRONG
                'type'      => 'select',
                'model'     => $model,
                'attribute' => 'category',
                'url'       => '/school/Materials_Photos/View', 
                'source'    => Editable::source(AssetCategory::model()->findAll($criteria),'id','category'),
                'placement' => 'right',
            ));
        ?>

        </div>
</div>

//SECOND DROPDOWN (SAMPLE ONLY)
<div class="control-group" id="sub_category" style="display: none">
    <label class="control-label" for="category">中カテゴリ</label>
    <div class="controls">
        <?php echo CHtml::dropDownList('sub_category', '', array(), array('prompt' => 'Select')); ?>
    </div>
</div>

但后来我看到了这个:

<a href="#" id="status" data-type="select" data-pk="1" data-url="/post" data-title="Select"></a>
<script>
$(function(){
    $('#status').editable({
        value: 2,    
        source: [
              {value: 1, text: 'Active'},
              {value: 2, text: 'Blocked'},
              {value: 3, text: 'Deleted'}
           ]
    });
});
</script>

我认为这更实用,我只是无法想象如何从ActiveRecord通过JS获取源代码。

2 个答案:

答案 0 :(得分:1)

你能不能简单地使用jQuery吗?

$(document).ready( function() {
    var drop1val = $(".drop1").val();
    if (drop1val == "first")
    {
          $(".drop2").hide();
    } else {
          $(".drop2").show();
    }
});

我不确定x-editable小部件是什么,我只是假设在一般的html表单方面,我的代码应该可行。至少要考虑一些事情。

如果您的代码生成了一个下拉列表,那么通过创建一个下拉列表,您是否可以向该标记添加一个类或ID?

答案 1 :(得分:1)

检查验证回调。可能它会帮助你。单击“确定”按钮时将触发验证。

请阅读此处。 http://x-editable.demopage.ru/index.php?r=site/widgets#Options

试试这个

        <?php
        $this->widget('editable.EditableField', array(
            'id' => 'drop', //ADDED THIS LINE SO I COULD GET THE SELECTED VALUE BUT I GUESS I'M WRONG
            'type' => 'select',
            'model' => $model,
            'attribute' => 'category',
            'url' => '/school/Materials_Photos/View',
            'source' => Editable::source(AssetCategory::model()->findAll($criteria), 'id', 'category'),
            'placement' => 'right',
            'validate' => 'js: function(value) 
            {
                console.log(value); //The value you are selecting from x-editable dropdown
                if($.trim(value) == "Somthing")
                {
                    //Your functionality
                }
            }'
        ));
        ?>