Jumat, 29 Maret 2013

[Yii Framework] Membuat Editable dengan Yii Booster


Saat ini akhirnya ada waktu luang untuk membuat artikel pada blog ini, sebab tugas-tugas kuliah telah selesai :D dan kali ini saya akan membahas pembuatan atau penerapan editable milik Yii Booster pada project yii anda.

Jangan lupa untuk memasang Yii Booster atau Yii Bootstrap Editable jika anda menggunakan Yii Bootstrap. Untuk langkah-langkahnya, pertama Anda buat table seperti berikut.

CREATE TABLE IF NOT EXISTS `people` (
  `PersonId` int(10) unsigned NOT NULL AUTO_INCREMENT,
  `Name` varchar(45) NOT NULL,
  `Age` int(10) unsigned NOT NULL,
  `RecordDate` datetime NOT NULL,
  PRIMARY KEY (`PersonId`)
) ENGINE=InnoDB  DEFAULT CHARSET=latin5 AUTO_INCREMENT=8 ;

INSERT INTO `people` (`PersonId`, `Name`, `Age`, `RecordDate`) VALUES
(1, 'Benjamin Button', 17, '2011-12-27 00:00:00'),
(2, 'Douglas Adams', 42, '2011-12-26 00:00:00'),
(3, 'Isaac Asimov', 26, '2011-12-28 00:00:00'),
(4, 'Thomas More', 61, '2011-12-27 00:00:00'),
(5, 'Ihsan Oktay Anar', 44, '2012-01-03 20:55:02');

kemudiah buat aplikasi yii baru, dan generate table di atas dengan Bootstrap Generator dengan nama controller People

Pada controller  PeopleController.php, tambahkan script berikut.

public function accessRules()
{
    return array(
        ...
        array('allow', // allow authenticated user to perform 'create' and 'update' actions
            'actions'=>array('create','update','editable'),
            'users'=>array('@'),
        ),
        ...
    );
}

public function actionEditable()
{
    if(Yii::app()->request->isAjaxRequest)
    {
        Yii::import('bootstrap.widgets.TbEditableSaver');
        $es=new TbEditableSaver('People');
        $es->update();
    }
    else
        throw new CHttpException(400,'Invalid request. Please do not repeat this request again.');
}
 

kemudian buka view admin.php, ini untuk memasang Editable pada CGridView/TbGridView

<?php $this->widget('bootstrap.widgets.TbGridView',array(
    'id'=>'people-grid',
    'dataProvider'=>$model->search(),
    'filter'=>$model,
    'columns'=>array(
        'PersonId',
        array(
            'class'=>'bootstrap.widgets.TbEditableColumn',
            'name'=>'Name',
            'sortable'=>true,
            'editable'=>array(
                'url'=>$this->createUrl('editable'),
                'placement'=>'right',
                'inputclass'=>'span3'
            )
        ),
        'Age',
        'RecordDate',
        array(
            'class'=>'bootstrap.widgets.TbButtonColumn',
        ),
    ),
)); ?>


dan kemudian buka juga view.php untuk menerapkan Editable pada View

<?php $this->widget('bootstrap.widgets.TbEditableDetailView', array(
    'id' => 'People-detail',
    'data' => $model,
    'url' => $this->createUrl('people/editable'),  
    'attributes'=>array(
        'PersonId',
        'Name',
        'Age',
        'RecordDate',
    )
)); ?>

Perhatikan pada controller tepatnya pada fungsi actionEditable, itu berguna untuk menyimpan data yang di kirim melalui editable dan controller tersebut hanya terbuka melalui ajax saja, jadi jika di buka melalui url tidak akan terbuka.

dan pada admin.php dan view.php itu terdapat beberapa script untuk editable, dan untuk lebih jelasnya dalam penggunaan editable silahkan kunjungi http://yii-booster.clevertech.biz/components.html

berikut penampakannya.



Download
 Password : didanurwanda.blogspot.com

Jumat, 22 Maret 2013

[CodeIgniter] Membuat Upload dan Image Manager untuk Redactor


Sebelum tidur saya akan memberikan sedikit cara agar Redactor dapat menyimpan gamber yang di upload agar dapat dijadikan galeri, sehingga Anda tidak perlu melakukan upload ulang. Penyimpanan informasi gambar dilakukan menggunakan database, berikut contoh structur tabelnya.

create table tbl_imagemanager(
    id int(5) auto_increment,
    foto varchar(255) not null,
    primary key(id)
)

Pada contoh ini, saya memakai controller welcome.php bawaan codeigniter. Untuk scriptnya sebagai berikut.

public function __construct()
{
    parent::__construct();
    $this->load->helper('url');
    $this->load->database();
}
    
public function index()
{
    $this->load->view('welcome_message');
}
    
public function upload()
{
       if(!empty($_FILES['file']['name']))
    {
        $config['upload_path'] = './img';
        $config['allowed_types'] = 'gif|jpg|png';
        $this->load->library('upload', $config);
        if($this->upload->do_upload('file'))
        {
            $image_data = $this->upload->data(); 
            
            // database
            $this->db->insert('tbl_imagemanager',array(
                'foto'=>$image_data['file_name']
            )); 
            
            $json = array(
                'filelink' => base_url("img/{$image_data['file_name']}")
            );
            echo stripslashes(json_encode($json));
        }
    }
}
    
public function galeri()
{
    $return=array();
    $all_data = $this->db->get('tbl_imagemanager');
    foreach($all_data->result_array() as $row)
    {
        $return[]=array(
            'thumb'=>base_url('img/'.$row['foto']),
            'image'=>base_url('img/'.$row['foto']),
            'title'=>$row['foto'],
        );
    }
    echo json_encode($return);
}

dan pada view

<script type="text/javascript" src="<?php echo base_url('assets/jquery-1.7.min.js'); ?>"></script>
<link rel="stylesheet" href="<?php echo base_url('assets/redactor.css'); ?>" />
<script src="<?php echo base_url('assets/redactor.min.js'); ?>"></script>
<script type="text/javascript">
$(document).ready(function(){
    $('#redactor_content').redactor({
        imageUpload: '<?php echo site_url('welcome/upload'); ?>',
        imageGetJson: '<?php echo site_url('welcome/galeri'); ?>',
    });
});
</script>
</head>
<body>

<div id="container">
 <h1>Redactor + Image Manager<span style="float:right">Dida Nurwanda</span></h1>

 <div id="body">
  <textarea id="redactor_content" name="content">
  </textarea> 
 </div>

 <p class="footer">Page rendered in <strong>{elapsed_time}</strong> seconds</p>
</div>

</body>
</html>


Disitu terdapat function upload, itu berfungsi untuk mengupload gamber, menyimpan informasi gamber ke database dan mengembalikan gambar beserta pathnya dalam bentuk json. Pada function galeri, itu berfungsi untuk mengambil informasi gamber dari database dan dikembalikan dalam bentuk json.

berikut penampakannya.




Download
password : didanurwanda.blogspot.com

Selasa, 19 Maret 2013

[Yii Framework] Membuat button pada CGridView dengan CButtonColumn


Sambil bikin dokumentasi buat GeCi versi berikutnya, iseng-iseng mampir dulu ke blog ini buat bikin artikel. Artikel macam apa yang akan saya buat. hehe Kali ini saya akan membuat artikel tentang pembuatan button pada CGridView dan keturunannya dengan bantuan class CButtonColumn.

pada view

<?php $this->widget('zii.widgets.grid.CGridView', array(
    'dataProvider'=>$model->search(),
    'filter'=>$model,
    'columns'=>array(
        .....
        array(
            'htmlOptions'=>array('style'=>'width:100px; text-align:center'),
            'class'=>'CButtonColumn',
            'template'=>'{view} {update} {delete} {kembali} {denda}',
            'buttons'=>array(
                'kembali'=>array(
                    'label'=>'Pengembalian',
                    'imageUrl'=>Yii::app()->baseUrl.'/img/accept.png',
                    'url'=>'Yii::app()->createUrl(\'peminjaman/kembali\',array(\'id\'=>\'\'.$data->id_peminjaman.\'\'))',
                    'visible'=>'$data->tanggalhabis >= date(\'Y-m-d\') ? true : false',
                ),
                'denda'=>array(
                    'label'=>'Denda',
                    'imageUrl'=>Yii::app()->baseUrl.'/img/accept.png',
                    'url'=>'Yii::app()->createUrl(\'denda/peminjaman\',array(\'id\'=>$data->id_peminjaman))',
                    'visible'=>'$data->tanggalhabis >= date(\'Y-m-d\') ? false : true',
                ),
            ),
        ),
    ),
)); ?>


Perhatikan pada   'template'=>'{view} {update} {delete} {kembali} {denda}', itu merupakan urutan button yang akan di tampilkan.

'buttons'=>array(

        'kembali'=>array(


'kembali' => merupakan nama button, untuk menampilkan sesuaikan dengan 'template'

'visible'=>'$data->tanggalhabis >= date(\'Y-m-d\') ? true : false',

digunakan untuk menampilkan dan menyembunyikan button sesuai dengan kebutuhan

'imageUrl'=>Yii::app()->baseUrl.'/img/accept.png', 

Menampilkan icon pada button.

Jumat, 15 Maret 2013

[CodeIgniter] GeCi - Memberi Keleluasaan Menggunakan CodeIgniter


Sebelum salat jumat, saya mau share kepada teman-teman yang suka dengan CodeIgniter. Apa itu ? hehe Saya akan share Widgets, ini berguna untuk memberi keleluasaan dalam menggunakan CI dan saya yakin GeCi akan membuat anda senang, sebab Anda akan lebih cepat dalam develop aplikasi.

Fitur yang ada di GeCi.
  • jQuery UI Widget
  • Form Widget
  • User Interface Widget
  • WYSIWYG
  • CGen (GeCi Code Generator)
  • dan lain-lain
 Untuk melihat demo dan mendownloadnya. silahkan klik di sini

Rabu, 06 Maret 2013

[Yii Framework] Menggunakan datepicker pada filter CGridView


Sudah seminggu saya mengacuhkan blog ini, karena kangen akhirnya saya kepengen menulis artikel kembali. Artikel yang akan saya bahas disini adalah mengenai penambahan datepicker pada Filter di CGridView. Sebenarnya penggunaan seperti ini dapat dibuat dengan manual, tetapi saya membuat extensions agar teman-teman dapat menggunakannya dengan mudah. Berikut cara menggunakannya.

Simpan file bernama EFilterDatePicker.php di folder extensions, kemudian pada CGridView buat seperti ini

<?php $this->widget('zii.widgets.grid.CGridView', array(
    ...
    'columns'=>array(
          ........
          array(
            'name'=>'tgllahir',
            'class'=>'ext.EFilterDatePicker',
            'model'=>$model,
            'attribute'=>'tgllahir',
            'options'=>array(
                'showAnim'=>'fade',
                'changeYear'=>true,
                'changeMonth'=>true,
                'dateFormat'=>'yy-mm-dd',
            ),
        ),
        .....
     ),
)); ?>


Gampangkan :D
Sebenarnya cara menggunakannya hampir sama dengan widget CJuiDatePicker, dan untuk name dan attribute isi sesuai dengan field anda.

berikut penampakannya




Untuk extensionsnya dapat anda download pada gambar di bawah ini, dan diharapkan untuk nama pembuatnya tidak  di rubah :D

Download
Password: didanurwanda.blogspot.com

Jumat, 01 Maret 2013

[Yii Framework] Menampilkan dan menghitung nilai Rupiah pada Yii


Sebenarnya saat saya membuat artikel ini saya sedang di lab kampus, bagian pemrograman web 1, nah mumpung ada internet gratis saya sempatin bikin artikel di sini :D Untuk pembahasan kali ini akan membahas menampilkan dan menghitung nilai dalam rupiah.

sebagai contoh untuk menampilkan nilai rupiah

echo Yii::app()->numberFormatter->formatCurrency(100000,"Rp. ");

maka akan menghasilkan Rp. 100.000,00

nah gimana contoh penghitungannya, gampang banget gan, ya jangan pake formater :D

Penampakannya