Search code examples
javascriptyiiyii2radio-buttonactive-form

Radio button selection changing value of Datepicker field


I've created form with three radio buttons with values Yatim, Piatu, and Miskin. I would like selecting value radio button Miskin to automatically change value of "tanggal meninggal bapak" and "tanggal meninggal ibu" fields to 0000-00-00.
I've tried to use JavaScript for this but without success. I don't know why.

This code in view/form

<?php

use yii\helpers\Html;
use yii\bootstrap\ActiveForm;
use yii\widgets\Pjax;
use yii\bootstrap\Modal;
use yii\helpers\Url;
use yii\db\ActiveRecord;
use kartik\widgets\DatePicker;

?>

<h1 align="center">Form Ubah</h2>
<?php
echo "&nbsp";
echo "&nbsp";
?>
<?php $form = ActiveForm::begin([
    'layout' => 'horizontal', 
    'enableAjaxValidation' => false,
    'id' => 'update-form',
    ]); ?>

<?= $form->field($model, 'kode_calon')->textInput(['readOnly' => true, 'style' => 'width:100px']) ?>
<?= $form->field($model, 'nama_calon')->textInput(['style' => 'width:380px']) ?>  
<?= $form->field($model, 'tempat_lahir')->textInput(['style' => 'width:380px']) ?> 
<?= $form->field($model, 'tanggal_lahir')->widget(DatePicker::classname(), [
    'options' => ['placeholder' => 'Masukkan tanggal lahir...'],
    'language' => 'id',
    'pluginOptions' => [
        'autoclose'=>true,
        'format' => 'yyyy-mm-dd'
    ]
    ]); ?>
<?= $form->field($model, 'pendidikan_terakhir')->textInput(['style' => 'width:380px']) ?>
<?= $form->field($model, 'status_anak')->radioList(array('Yatim'=>'Yatim', 'Piatu'=>'Piatu', 'Miskin'=>'Miskin')); ?>  
<?= $form->field($model, 'anak_ke')->textInput(['style' => 'width:380px', 'type' => 'number']) ?> 
<?= $form->field($model, 'dari_ke')->textInput(['style' => 'width:380px', 'type' => 'number']) ?>
<?= $form->field($model, 'alamat')->textArea(['style' => 'width: 380px']) ?>
<?= $form->field($model, 'nama_bapak')->textInput(['style' => 'width:380px']) ?>
<?= $form->field($model, 'alamat_bapak')->textInput(['style' => 'width:380px']) ?>
<?= $form->field($model, 'pekerjaan_bapak')->textInput(['style' => 'width:380px']) ?>
<?= $form->field($model, 'tanggal_meninggal_bapak')->widget(DatePicker::classname(), [
    'options' => ['placeholder' => 'Masukkan tanggal meniggal bapak...'],
    'language' => 'id',
    'pluginOptions' => [
        'autoclose'=>true,
        'format' => 'yyyy-mm-dd'
    ]
    ]); ?>
<?= $form->field($model, 'nama_ibu')->textInput(['style' => 'width:380px']) ?>  
<?= $form->field($model, 'alamat_ibu')->textInput(['style' => 'width:380px']) ?> 
<?= $form->field($model, 'pekerjaan_ibu')->textInput(['style' => 'width:380px']) ?> 
<?= $form->field($model, 'tanggal_meninggal_ibu')->widget(DatePicker::classname(), [
    'options' => ['placeholder' => 'Masukkan tanggal meninggal ibu...'],
    'language' => 'id',
    'pluginOptions' => [
        'autoclose'=>true,
        'format' => 'yyyy-mm-dd'
    ]
    ]); ?>
<?= $form->field($model, 'nama_wali')->textInput(['style' => 'width:380px']) ?>
<?= $form->field($model, 'alamat_wali')->textInput(['style' => 'width:380px']) ?> 
<?= $form->field($model, 'pekerjaan_wali')->textInput(['style' => 'width:380px']) ?>
<?= $form->field($model, 'status_ketentuan')->hiddenInput(['value'=>'Belum lolos'])->label(false); ?>

<div class="form-group">
    <div class="col-sm-offset-4">
<?= Html::submitButton('Ubah', ['class' => 'btn btn-primary']) ?>

<?php
echo "&nbsp";
echo "&nbsp"; 
echo Html::a('Keluar', ['index'],[
    'class'=>'btn btn-success',
    'onclick' =>'$("#calonModal").modal("hide");
    return false;'
    ]);
?>
<?php ActiveForm::end();?>

<?php
$this->registerJs(' 
(function() {
  $("#Miskin").change(function() {
    if ($("#Miskin").is(":checked")) {
      $("#tanggal_meninggal_bapak").attr("readonly",true);
      $("#tanggal_meninggal_ibu").attr("readonly",true);
      $("#tanggal_meninggal_bapak", "#tanggal_meninggal_ibu").datepicker( {value:"0000-00-00",dateFormat: "yyyy-MM-dd" });
    } 
  });
});
');
?>


Solution

  • <?= $form->field($model, 'tanggal_meninggal_bapak')->widget(DatePicker::classname(), [
    'options' => ['placeholder' => 'Masukkan tanggal meniggal bapak...', 'id'=>'bapak'],
    'language' => 'id',
    'pluginOptions' => [
        'autoclose'=>true,
        'format' => 'yyyy-mm-dd'
    ]
    ]); ?>
    <?= $form->field($model, 'tanggal_meninggal_ibu')->widget(DatePicker::classname(), [
    'options' => ['placeholder' => 'Masukkan tanggal meninggal ibu...', 'id'=>'ibu'],
    'language' => 'id',
    'pluginOptions' => [
        'autoclose'=>true,
        'format' => 'yyyy-mm-dd'
    ]
    ]); ?>
    
    
    /*js*/
    $("input[type=radio]").change(function() {
        var isi          = this.value;
        if(isi == "Miskin"){
           $('#bapak').val("0000-00-00");
           $('#ibu').val("0000-00-00");
           $("#bapak").attr("disabled",true);
           $("#ibu").attr("disabled",true);
        }
    });