如何在Yii javascript中使用checkBox隱藏或顯示textField

Question

我已經在我的Yii項目視圖中激活了我的js文件：

<?php
/* Register javascript */
Yii::app()->clientScript->registerScriptFile(Yii::app()->baseUrl . '/js/showHide.js');
?>

仍然在我看來，我有一個名為“ tbo_sk”的復選框和一個名為“ nilaiblksk”的文本字段

<?php echo $form->checkBox($model, 'tbo_sk'); ?>
<div style="display: none"><?php echo $form->textField($model, 'nilaiblksk'); ?></div>

我的問題是，如何在我的showHide.js文件中制作javascript代碼，以便每當我選中checkBox時顯示textField，否則如果未選中則隱藏textField？

在我的div標簽中，我正在使用style =“ display：none”隱藏textField。

提前致謝！

Answer 1

最好給div一個ID或Class，而不是在jQuery中使用parent（）：

<div id="hiddenDiv" style="display: none"><?php echo $form->textField($model, 'nilaiblksk'); ?></div>

<script>
$(document).ready(function(){
    $('#MODELNAME_tbo_sk').change(function(){
        $('#hiddenDiv').toggle(); // or do $('#MODELNAME_nilaiblksk').parent().toggle();
    });
});
</script>

Answer 2

然后在視圖文件中添加以下代碼：

在文檔上注冊一個jQuery函數，以准備切換輸入：

$buttonToggler= <<<JS
    toggleInput=function(src,inputName){
      if(src.checked){
        $(src.form[inputName]).removeProp('disabled');
       }else{
         $(src.form[inputName]).prop('disabled','disabled');
       }
    }
JS;
Yii::app()->clientScript->registerScript('toggleFormInputs',$buttonToggler, CClientScript::POS_READY);

向復選框更改事件添加功能：

echo $form->checkBox($model,'tbo_sk',
      array('onchange'=>'js:toggleInput(this,"ModelName[nilaiblksk]")'));

echo $form->textField($model,"nilaiblksk");

您必須替換實際的模型名稱，例如“ ModelName [nilaiblksk]”，例如對於后期模型，無論您使用的是哪種實際模型，其名稱都將為“ Post [nilaiblksk]”。

還有一件事，您必須更改toggleInput函數，例如，如果您可能只想使其變為只讀或添加remove css類