根据所选下拉列表隐藏一些表单元素

时间:2018-02-02 19:09:35

标签: php jquery

我想根据该表单中选定的下拉菜单隐藏表单的元素。我成功地根据那个特定的领域隐藏了田地。但是当我尝试更新该特定记录时,它再次加载包含输入数据的所有字段的页面。但我需要再次选择相同的菜单,之后我再次隐藏这些字段。我正在使用PHP来实现此功能。

我认为这是因为我正在使用jQuery的更改功能。以下是该功能的代码:

<div class="left-corner"></div>

我是否可以使用任何其他功能而不是以几乎相似的方式工作的更改功能,但只要我尝试更新该记录时,只给我必需的字段。当我改变选项时也会改变。

- 解决此问题之前的问题。此行之后需要解决问题的方法 -

此外,我还有一些我不会在“歌曲”中提到的字段。像&#39; story_description&#39;这样的viewpage,但设置&#34; required =&gt;真的&#34;在我的模型中。因此,即使我正在隐藏歌曲&#39; Song&#39;,我需要在其中添加一些默认值。如何在index.php或&#39; controller.php&#39;中添加默认值。

这是我在index.php中的一段代码,我隐藏了那个元素。

  $(document).ready(function() {

    $('#viewpage').on('change',function(){

        switch(this.value){
            case '1':
                $('.Song').show();
                $('.Videos').hide();
                break;
            case '2':
                $('.Videos').show();
                $('.Song').hide();
                break;
        }
    })
});

这是我的控制器文件代码:

 <div class="form-group vid_field" <?= $option != 2 ? "" : "style='display:none'"  ?>>
                <label>Description</label>
                <?php echo $model->Form->editorFor("description"); ?>
 </div>

我认为设置默认值的代码必须放在控制器文件中。就像我们可以检查所选页面是否为Song一样,Description的默认值必须是=&#34; XYZ&#34;。我不知道我们怎么能这样做。帮助赞赏。 TIA

2 个答案:

答案 0 :(得分:0)

尝试阻止页面加载

$(document).ready(function() {

$('#viewpage').on('change',function(event){

event.preventDefault();

switch(this.value){
        case '1':
            $('.Song').show();
            $('.Videos').hide();
            break;
        case '2':
            $('.Videos').show();
            $('.Song').hide();
            break;
    }
})

});

答案 1 :(得分:0)

将您的逻辑移动到单独的函数,并在pageload之后调用它(不仅在更改事件触发时)。您也可以$('#viewpage').change();

$(document).ready(function() {
    updateView($('#viewpage'));
});

$('#viewpage').on('change',function(){
    updateView($(this));
});

function updateView(elem) {
    switch(elem.val()){
        case '1':
            $('.Song').show();
            $('.Videos').hide();
            break;
        case '2':
            $('.Videos').show();
            $('.Song').hide();
            break;
    }
}