简体   繁体   中英

ajax with 2 parameters yii2

I'm a beginner at yii2. I want to reload the page using ajax and based on the 2 selected parameters, but nothing happens. I don't know what's wrong. Can you help me to find the problem?Thanks

controllers code, i want to display based on 2 parameters (id and employee)

public function actionGetDataPegawai($pegawai, $id)
{
    $dataMatriksPegawai = new \yii\db\Query();
    $dataMatriksPegawai->select('c.abk_id, k.*, p.nama_petugas')->from('{{%alokasi_beban_kerja}} c');
    $dataMatriksPegawai->join('INNER JOIN', '{{%kegiatan}} k', 'c.id_kegiatan = k.id_kegiatan');
    $dataMatriksPegawai->join('INNER JOIN', '{{%petugas}} p', 'c.petugas_id = p.petugas_id');
    $dataMatriksPegawai->where("MONTH(tanggal_mulai) = $id");
    $dataMatriksPegawai->andwhere("c.petugas_id= $pegawai");
    $data = $dataMatriksPegawai->all();

    $total = count($data);

    return $this->renderAjax('_matriksPegawai', ['data' => $data, 'total' => $total]);

    
}

view code,i want to replay gantchart

$urlData = Url::to(['site/get-data-pegawai']);
$js = <<<js
$('._pilih').on('click', function(event){
event.preventDefault();
var data = {};
data.id = $('#bulan').val();
data.pegawai = $('#pegawai').val();
$.ajax({
    url:"{$urlData}",
  type:'GET',
  dataType:'json',
  data:data,
  success:function(data){
    $("#tabel").html(data);    } }); }); js; $this->registerJs($js)?>
<div class="col-lg-3">
    <?php echo '<b>Pilih Bulan : </b>' ?>
    <?= Html::dropDownList(
        'bulan',
        null,
        $items =
            [
                1 => 'Januari',
                2 => 'Februari',
                3 => 'Maret',
                4 => 'April',
                5 => 'Mei',
                6 => 'Juni',
                7 => 'Juli',
                8 => 'Agustus',
                9 => 'September',
                10 => 'Oktober',
                11 => 'November',
                12 => 'Desember',
            ],
        ['class' => 'form-control', 'id' => 'bulan', 'prompt' => '- Pilih bulan -']
    ) ?>
</div>
<div class="col-lg-3">
    <?php echo '<b>Pilih Pegawai : </b>' ?>
    <?= Html::dropDownList('pegawai', null, $dafpetugas, ['class' => 'form-control', 'id' => 'pegawai', 'prompt' => '- Pilih Pegawai -']) ?>


</div>
<div class="col-lg-3">
    <button class="btn btn-primary _pilih">Pilih</button>

</div>
<head>

    <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
    <script type="text/javascript">
        google.charts.load('current', {
            'packages': ['gantt']
        });
        google.charts.setOnLoadCallback(drawChart);

        function drawChart() {

            var data = new google.visualization.DataTable();
            data.addColumn('string', 'id_kegiatan');
            data.addColumn('string', 'nama_kegiatan');
            data.addColumn('string', 'fungsi');
            data.addColumn('date', 'tanggal_mulai');
            data.addColumn('date', 'tanggal_selesai');
            data.addColumn('number', 'durasi');
            data.addColumn('number', 'persentase_selesai');
            data.addColumn('string', 'ketergantungan');

            data.addRows([
                <?php


                foreach ($result as $row) {
                    $date = new DateTime($row['tanggal_mulai']);
                    $date2 = new DateTime($row['tanggal_selesai']);
                    echo "['" . $row['abk_id'] . "',
                '" . $row['nama_petugas'] . "',
                '" . $row['nama_kegiatan'] . "',
                new Date (" . date("Y", strtotime($row['tanggal_mulai'])) . "," . DATE_FORMAT($date, 'm') . "," . DATE_FORMAT($date, 'd') . "),
                new Date (" . date("Y", strtotime($row['tanggal_selesai'])) . "," . DATE_FORMAT($date2, 'm') . "," . DATE_FORMAT($date2, 'd') . "),
                " . $row['durasi'] . ",
                " . $row['persentase_selesai'] . ",
                " . 'null' . "],";
                };
                ?>
            ]);

            var options = {
                height: 500,
                gantt: {
                    trackHeight: 30
                }
            };

            var chart = new google.visualization.Gantt(document.getElementById('chart_div'));

            chart.draw(data, options);
        }
    </script>
</head>

<body>
    <div id="chart_div"></div>
</body>

You can debug this by using inspect on your browser to see where the get/post request is going. It also helps to add throw new \Exception('ajax call was made'); in the action your trying to use to verify the request is going to right place.

I think it is either the request is not reaching action or that ajax is not rendering in the destination div.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM