[Yii Framework] Membuat Entry Data Many to many dengan Tabel Dinamis

Sebelumnya sudah pernah ada paparan mengenai langkah-langkah membuat entry data one to many dengan tabel dinamis disini. Nah, sekarang muncul permasalah lain dimana kita perlu membuat entry data untuk tabel yang memiliki hubungan many to many relation. Okeh, sebelumnya saya akan memberikan contoh untuk tabel “Mahasiswa” dan tabel “Dosen”. Misal saya definisikan bahwa mahasiswa bisa memiliki banyak dosen yang mengajarinya, dan dosen juga bisa memiliki banyak mahasiswa yang diajarinya. Nah, sudah kita ketahui jika ada tabel yang memiliki hubungan many to many, maka kita perlu membuat sebuah tabel penghubung antara kedua tabel tersebut. Pada kasus ini saya akan membuat sebuah tabel penghubung bernama “JunctionTab” Berikut gambaran lengkap tabel nya:

CREATE TABLE IF NOT EXISTS `dosen` (
  `id` int(11) NOT NULL AUTO_INCREMENT,
  `dosen` varchar(50) NOT NULL,
  `jk` enum('laki-laki','perempuan') NOT NULL,
  PRIMARY KEY (`id`)
) ENGINE=InnoDB  DEFAULT CHARSET=latin1 AUTO_INCREMENT=5 ;

CREATE TABLE IF NOT EXISTS `junctiontab` (
  `id` int(11) NOT NULL AUTO_INCREMENT,
  `dosenId` int(11) NOT NULL,
  `mahasiswaId` int(11) NOT NULL,
  PRIMARY KEY (`id`),
  KEY `dosenId` (`dosenId`),
  KEY `mahasiswaId` (`mahasiswaId`)
) ENGINE=InnoDB  DEFAULT CHARSET=latin1 AUTO_INCREMENT=6 ;

CREATE TABLE IF NOT EXISTS `mahasiswa` (
  `id` int(11) NOT NULL AUTO_INCREMENT,
  `mahasiswa` varchar(50) NOT NULL,
  `jk` enum('laki-laki','perempuan') NOT NULL,
  PRIMARY KEY (`id`)
) ENGINE=InnoDB  DEFAULT CHARSET=latin1 AUTO_INCREMENT=8 ;

ALTER TABLE `junctiontab`
  ADD CONSTRAINT `junctiontab_ibfk_2` FOREIGN KEY (`mahasiswaId`) REFERENCES `mahasiswa` (`id`),
  ADD CONSTRAINT `junctiontab_ibfk_1` FOREIGN KEY (`dosenId`) REFERENCES `dosen` (`id`);

Okeh, setelah anda membuat tabel-tabel tersebut di database anda, silahkan anda generate model dan CRUD nya dengan menggunakan GII. Pada pembahasan tentang “Entry Data One to many” saya sudah menerangkan bahwa saya disana menggunakan sebuah extension bernama JAppendo. Saya sarankan anda pelajari terlebih dahulu postingan saya sebelumnya agar anda dapat lebih memahaminya. Sekarang silahkan anda download JAppendo tersebut, kemudian pindahkan ke dalam “project/protected/extensions/”. Setelah itu pada folder “appendo/views” buatlah sebuah file .php bernama “dosen.php”, lalu masukkan code berikut ke dalam file tersebut:

<table class="appendo-gii" id="<?php echo $id ?>">
 <thead>
  <tr>
   <th>Nama </th>
  </tr>
 </thead>
 <tbody>
    <?php if ($model->mahasiswaId == null): ?>
  <tr>
            <td>
            <?php echo CHtml::dropDownList('mahasiswaId[]',"string",
                Chtml::listData(Mahasiswa::model()->findAll(),'id','mahasiswa'),
                array('style'=>'width:200px'));
            ?>
            </td>
  </tr>
    <?php else: ?>
        <?php for($i = 0; $i < sizeof($model->mahasiswaId); ++$i): ?>
      <tr>
                <td>
                <?php echo CHtml::dropDownList('mahasiswaId[]',$model->enum_type[$i],    
                 Chtml::listData(Mahasiswa::model()->findAll(),'id','mahasiswa'),
                 array('style'=>'width:200px'));
                ?>
                </td>
            </tr>
        <?php endfor; ?>
  <tr>
            <td>
            <?php echo CHtml::dropDownList('mahasiswaId[]',"string",
                Chtml::listData(Mahasiswa::model()->findAll(),'id','mahasiswa'),
                array('style'=>'width:200px'));
            ?>
            </td>
  </tr>
    <?php endif; ?>
 </tbody>
</table>

Penjelasan : code tersebut digunakan untuk melakukan perulangan agar kita bisa melakukan entry data dengan kondisi misal “ENTRY SEMUA MAHASISWA YANG DIBIMBING OLEH DOSEN A”.

Setelah itu, di dalam folder yang sama silahkan anda buat lagi sebuah file .php dengan nama “mahasiswa.php”. Lalu isi code berikut:

<table class="appendo-gii" id="<?php echo $id ?>">
 <thead>
  <tr>
   <th>Nama </th>
  </tr>
 </thead>
 <tbody>
    <?php if ($model->dosenId == null): ?>
  <tr>
            <td>
            <?php echo CHtml::dropDownList('dosenId[]',"string",
                Chtml::listData(Dosen::model()->findAll(),'id','dosen'),
                array('style'=>'width:200px'));
            ?>
            </td>
  </tr>
    <?php else: ?>
        <?php for($i = 0; $i < sizeof($model->dosenId); ++$i): ?>
      <tr>
                <td>
                <?php echo CHtml::dropDownList('dosenId[]',$model->enum_type[$i],    
                 Chtml::listData(Dosen::model()->findAll(),'id','dosen'),
                 array('style'=>'width:200px'));
                ?>
                </td>
            </tr>
        <?php endfor; ?>
  <tr>
            <td>
            <?php echo CHtml::dropDownList('dosenId[]',"string",
                Chtml::listData(Dosen::model()->findAll(),'id','dosen'),
                array('style'=>'width:200px'));
            ?>
            </td>
  </tr>
    <?php endif; ?>
 </tbody>
</table>

Penjelasan : Sama seperti code sebelumnya. Hanya saja code di atas digunakan untuk melakukan perulangan. Misal untuk melakukan entry data dengan kondisi “ENTRY SEMUA NAMA DOSEN YANG MENGAJARI MAHASISWA A”.

Setelah selesai melaksanakan instruksi di atas, kini silahkan menuju “protected/controllers/junctiontabcontroller”. Lalu buatlah sebuah function baru bernama “actionDosen”, lalu masukkan code seperti berikut:

 public function actionDosen()
 {  
  $model=new JunctionTab;

  if(isset($_POST['dosen']))
  {
   $total = count($_POST['mahasiswaId']);
      for ($i = 0; $i <= $total; $i++)
      {
       if(isset($_POST['mahasiswaId'][$i]))
       {
         $jiakakak = new JunctionTab;
         $jiakakak->dosenId =$_POST['dosen'];
           $jiakakak->mahasiswaId = $_POST['mahasiswaId'][$i];
            $jiakakak->save();
       }
      }
   $this->redirect(array('admin'));
  }

  $this->render('dosenn',array(
   'model'=>$model,
  ));
 }

Penjelasan : fungsi di atas berguna untuk menjalankan proses yang akan di jalankan untuk melakukan entry data dan penyimpanan pada kondisi “ENTRY DATA NAMA MAHASISWA YANG DIAJARI OLEH DOSEN ?”.

Setelah itu buat juga fungsi untuk mengentry dengan kondisi “ENTRY DATA NAMA DOSEN YANG MENGAJARI MAHASISWA ?”. Masukkan code berikut di dalam controller:

 
 public function actionMahasiswa()
 {  
  $model=new JunctionTab;

  if(isset($_POST['mahasiswa']))
  {
   $total = count($_POST['dosenId']);
      for ($i = 0; $i <= $total; $i++)
      {
       if(isset($_POST['dosenId'][$i]))
       {
         $jiakakak = new JunctionTab;
         $jiakakak->dosenId =$_POST['dosenId'][$i];
           $jiakakak->mahasiswaId = $_POST['mahasiswa'];
            $jiakakak->save();
       }
      }
   $this->redirect(array('admin'));
  }

  $this->render('mahasiswan',array(
   'model'=>$model,
  ));
 }

Okeh, selesai sudah kita bermain-main dengan controller. Sekarang silahkan menuju folder “protected/views/junctiontab”. Lalu buat sebuah file .php dengan nama “dosenn.php” dan “mahasiswan.php”. Setelah itu pada dosenn.php, masukkan code berikut:

<div class="form">

<?php $form=$this->beginWidget('CActiveForm', array(
 'id'=>'junction-tab-form',
 'enableAjaxValidation'=>false,
)); ?>



 <div class="row">
  <?php echo 'Nama Dosen :'; ?>
        <?php echo CHtml::dropDownList('dosen',"string",
                Chtml::listData(Dosen::model()->findAll(),'id','dosen'),
                array('style'=>'width:200px'));
        ?>
 </div>

 
 <div class="row">
     <?php $this->widget('application.extensions.appendo.JAppendo',array(
         'id' => 'repeateEnum',
         'model' => $model,
         'viewName' => 'dosen',
         'labelDel' => 'Remove Row',
     )); ?>
    </div>

 <div class="row buttons">
  <?php echo CHtml::submitButton($model->isNewRecord ? 'Create' : 'Save'); ?>
 </div>

<?php $this->endWidget(); ?>

</div>

Penjelasan : code di atas adalah tampilan yang akan muncul jika kita memilih menu actionDosen.

Setelah itu pada mahasiswan.php sendiri, masukkan code berikut:

<div class="form">

<?php $form=$this->beginWidget('CActiveForm', array(
 'id'=>'junction-tab-form',
 'enableAjaxValidation'=>false,
)); ?>



 <div class="row">
  <?php echo 'Nama Mahasiswa :'; ?>
        <?php echo CHtml::dropDownList('mahasiswa',"string",
                Chtml::listData(Mahasiswa::model()->findAll(),'id','mahasiswa'),
                array('style'=>'width:200px'));
        ?>
 </div>

 
 <div class="row">
     <?php $this->widget('application.extensions.appendo.JAppendo',array(
         'id' => 'repeateEnum',
         'model' => $model,
         'viewName' => 'mahasiswa',
         'labelDel' => 'Remove Row',
     )); ?>
    </div>

 <div class="row buttons">
  <?php echo CHtml::submitButton($model->isNewRecord ? 'Create' : 'Save'); ?>
 </div>

<?php $this->endWidget(); ?>

</div>

Okeh, selesai sudah coding nya.. Jika code yang anda buat sudah benar, maka anda akan mendapati tampilan seperti ini jika memasukkan link http://localhost/mtom/index.php?r=junctiontab/dosen:

Lalu jika anda memanggil URL berikut http://localhost/mtom/index.php?r=junctiontab/mahasiswa, akan terlihat tampilan entri seperti berikut:

Nah, untuk menmpilkan hasil entry tabel nya, kita buat agar tampilannya lebih menarik. Maka masuk ke halaman “protected/views/junctiontab/admin.php” lalu edit komponen CGridView yang sebelumnya seperti ini:

<?php $this->widget('zii.widgets.grid.CGridView', array(
 'id'=>'junction-tab-grid',
 'dataProvider'=>$model->search(),
 'filter'=>$model,
 'columns'=>array(
  'id',
  'dosenId',
  'mahasiswaId',
  array(
   'class'=>'CButtonColumn',
  ),
 ),
)); ?>

Menjadi seperti berikut:

<?php $this->widget('zii.widgets.grid.CGridView', array(
 'id'=>'junction-tab-grid',
 'dataProvider'=>$model->search(),
 //'filter'=>$model,
 'columns'=>array(
  'id',
  array(
   'name'=>'Nama Dosen',
   'type'=>'raw',
   'value'=>'Dosen::model()->findByPk($data->dosenId)->dosen',
  ),
  array(
   'name'=>'Nama Mahasiswa',
   'type'=>'raw',
   'value'=>'Mahasiswa::model()->findByPk($data->mahasiswaId)->mahasiswa',
  ),
  array(
   'class'=>'CButtonColumn',
  ),
 ),
)); ?>

Sehingga tampilan halaman adminnya akan menjadi seperti berikut: