Monthly Archives

4 Articles

Mengubah Action Click Button Secara Dinamis dengan Fungsi unbind

Pada artikel ini dijelaskan cara mengubah action click button secara dinamis.

Contoh apabila ada 3 button, button_pertama, button_kedua dan button_ketiga. Action pada button_ketiga ditentukan oleh action button_pertama atau action button_kedua. Apabila button_pertama di click, maka button_ketiga akan memanggil fungsi_pertama apabila di-click. Apabila button_kedua di-click, maka button_ketiga akan memanggil fungsi_kedua.

Setiap button_pertama atau button_kedua di-click akan dipanggil dahulu fungsi unbind click action untuk button_kedua Fungsi unbind pada javascript digunakan untuk melepaskan action fungsi sebelumnya. Setelah fungsi unbind dipanggil, button_ketiga dapat di-bind pada fungsi baru.

Berikut baris kode javascript menggunan JQuery, kode ini diletakkan di dalam $(document).ready(function(){}):

$(‘#button_pertama’).click(function() {

$(‘#button_ketiga’).unbind(‘click’);

$(‘#button_ketiga’).click(fungsi_pertama);

});

function fungsi_pertama()

{

// Kode untuk fungsi_pertama

}

$(‘#button_kedua’).click(function() {

$(‘#button_ketiga’).unbind(‘click’);

$(‘#button_ketiga’).click(fungsi_kedua);

});

function fungsi_kedua()

{

// Kode untuk fungsi_kedua

}

Referensi selengkapnya mengenai fungsi unbind dapat dilihat di http://api.jquery.com/unbind/

JQuery Ajax

Ajax merupakan teknik pemrograman web dinamis menggunakan javascript. Ajax dapat digunakan untuk mengambil data dari database tanpa harus me-reloading halaman atau berpindah url. Fungsi ajax dapat dikombinasikan dengan button atau event lainnya.

Pada artikel ini akan dijelaskan mengenai penggunaan Ajax pada JQuery, pembaca diharapkan sudah mengerti dasar php, html, javascript dan JQuery seperti membuat function, deklarasi variabel dan mengakses DOM dengan JQuery.

Berikut ini adalah contoh penggunaan Ajax pada JQuery.

Kode ini diletakkan di dalam $(document).ready(function(){} )

$.ajax({

url: http://www.yohanli.com/index.php/c_contoller_anda/fungsi_yang_dipanggil, //misalnya url controller anda

data: parameter,

cache: false,

dataType: “json”,

beforeSend: function() {before_ajax();},

complete: function() {after_ajax();},

success: function(result_json) {success_function(result_json);}

});

Data parameter

Parameter merupakan variabel yang akan di pass ke halaman selanjutnya. Contoh parameter didapatkan dari input box dengan id input_box_1, maka akan ditulis dengan format: ‘data1=’ + $(# input_box_1).val(). parameter ini mem-passing variabel data1 di url tujuan. Variabel ini dapat diakses dengan cara $_GET[‘data_1’] menggunakan php.

Multiple parameter dari banyak input box dapat dilakukan dengan contoh berikut ini:

var parameter = ‘data1=’ + $(#input_box_1).val() + ‘&data2=’ + $(#input_box_2).val()’;

Kode di atas menjelaskan bahwa akan ada 2 variabel yang dipass yaitu data1 dan data2 yang diambil dari input_box 1 dan input_box_2

Pada url tujuan, variabel ini dapat diambil menggunakan php dengan cara $_GET[‘data1’] dan $_GET[‘data2’]

 

Function

Fungsi before_ajax(), after_ajax() dan success_function() merupakan fungsi javascript yang maxing-masing akan di-execute pada saat terjadi ajax request. Fungsi ini dapat diletakkan di dalam $(document).ready(function() ).

function before_ajax()

{

// Kode ini akan dipanggil sesaat sebelum ajax request

}

function after_ajax()

{

// Kode ini akan dipanggil sesaat sesudah ajax request

}

 function success_function(result_json)
{
// Kode ini dipanggil setelah ajax berhasil memberikan return yang dapat berupa json, jsonp, xml, script, text atau html.
}

Variabel yang didapat dari ajax dapat diakses langsung oleh javascript. Pada contoh ini  digunakan JSON, JSON lebih fleksibel dan relatif simple daripada xml.

Contoh apabila return merupakan json data berupa {“hasil”: {“nama” : “saya”, “umur” : “20 tahun”}}

Data ini dapat diakses dengan cara:

result_json[‘hasil’][‘nama’] akan menghasilkan string “saya”

result_json[‘hasil’][‘nama’] akan menghasilkan string “20 tahun”
Kode PHP URL Tujuan
Berikut adalah contoh coding URL tujuan

<?php
class C_Controller_Anda {

function __construct()

{

// Kode Constructor

}

function index()

{

// Kode Index

}

function fungsi_yang_dipanggil()

{

// di sini diletakkan kode untuk menyajikan data return

$data_pertama = $_GET[‘data1’]; // ini adalah cara mengambil parameter  data1

$data_kedua = $_GET[‘data2’]; // ini adalah cara mengambil parameter data2

$result_json = $this->Model_Anda->fungsi_di_dalam_model_yang_dipanggil($data_pertama, $data_kedua);

echo $result_json; // ini data yang akan diterima oleh ajax

}

} ?>

 

Referensi JQuery Ajax dapat dilihat di http://api.jquery.com/jQuery.ajax/
Selamat belajar…

Cara Stop Adobe Updater dari Startup pada Mac

Kadang user terganggu sekali dengan adanya service adobe updater yang selalu muncul saat Mac dijalankan. Adobe updater menggunakan resource internet tanpa sepengetahuan user dengan cara mengkoneksikan ke server adobe. Sayangnya service ini tidak dapat dihentikan dengan cara biasa melalui System Preferences… Users & Groups -> Login Items.

Artikel ini mencoba menjelaskan cara menghentikan service adobe updater melalui terminal.
Do it at your own risk.

Tujuan: Menghapus plist Adobe Updater dari start up pada Mac OS X
Tools: Terminal (Buka dengan Command + Space lalu ketik terminal)

Langkah Kerja:
1. Buka Terminal
2. Pindah ke folder Library/LaunchAgents dengan mengetikkan cd ~/Library/LaunchAgents pada terminal
3. Hapus file com.adobe.* dengan mengetikkan rm com.adobe.*

Alternatifnya adalah memindahkan file com.adobe.*.plist ke folder lain.

Selamat mencoba.