Membuat Link HTML menggunakan Anchor

Pengertian dalam HTML

Anchor adalah tag <a> dalam HTML yang digunakan untuk membuat satu link yang menuju ke halaman lain dari website.

Syntax:

<a  href=”link_tujuan”>Tulisan yang akan diklik</a>

Keterangan:

  • <a> adalah tag anchor
  • href, adalah attribute yang digunakan untuk menuliskan link tujuan.

Contoh:

Buatlah satu file HTML bernama anchor.html dan masukkan kode seperti dibawah ini:

<a href=”http://www.detik.com”>Menuju ke Website detik.com</a>

Hasil:

Buka file anchor.html dengan browsermu maka akan tampil seperti gambar dibawah ini:

Keterangan:

Jadi jika kamu klik tulisan Menuju ke Website detik.com pada gambar diatas maka halaman webmu akan menampilkan isi dari website detik.com


Fungsi Anchor() dalam CodeIgniter

Digunakan untuk membuat link HTML berdasarkan URL site lokalmu.

Site lokal ini adalah paduan dari nilai $config[‘base_url’] ditambah nilai dari $config[‘index_page’];

Contoh:

$config[‘base_url’]=’http://localhost/system_informasi’;

$config[‘index_page’]=’index.php’;

Maka site lokalmu adalah http://localhost/sistem_informasi/index.php

 

Membuat Anchor dalam CodeIgniter

Syntax:

anchor(segment_uri, teks, attribute)

Terlihat pada syntax diatas bahwa fungsi anchor() mempunyai tiga parameter, yaitu:

  • Segment_uri  adalah parameter yang ditambahkan pada URL.
  • Teks adalah teks link yang ditampilkan pada browser (yang nantinya kita klik)
  • Attribute adalah attribute yang bisa kamu masukkan, attribut ini bisa berbentuk string atau array.

Contoh:

echo anchor(‘pegawai/lihat_absensi’,’Lihat Absensi Pegawai’);

ini sama dengan kode HTML dibawah ini:

<a href=”http://localhost/sistem_informasi/index.php/pegawai/lihat_absensi”>Lihat Absensi Pegawai</a>

Keterangan:

  • Anchor(‘pegawai/lihat_absensi’, ‘Lihat Absensi Pegawai’), kode ini berarti saya membuat link ke ‘http://localhost/sistem_informasi/index.php/pegawai/lihat_absensi’, jadi ‘pegawai/lihat_absensi’ otomatis ditambahkan ke site URL lokalmu, dimana site URL lokalmu adalah http://localhost/sistem_informasi/index.php

Contoh Kasus 1:

Rubahlah Menu:

  • Blog menjadi input pegawai
  • Photos menjadi lihat pegawai

Seperti terlihat pada gambar dibawah ini:

Muncul Pertanyaan:

Bagaimana membuatnya ?

Jawaban:

Buka file header.php dan ganti tulisan

<a href="#">Blog</a>

Menjadi

<?php echo anchor("pegawai/input_data", "Input Pegawai");?>

Keterangan:

  • Pegawai adalah nama Controllermu
  • Input_data adalah metode dari Controllermu

Jadi buat juga Controlller pegawai dan metode input_data Karena akan digunakan pada latihan selanjutnya.

Contoh Kasus ke-2:

Lalu ketika saya klik menu input pegawai maka isi dari halaman web adalah tulisan "Form Input Data Pegawai" seperti terlihat pada gambar dibawah ini:

Muncul Pertanyaan:

Bagaimana cara membuatnya ?

Jawaban:

Buatlah satu file View bernama input_data_pegawai.php dengan isi seperti dibawah ini:

<h2>Form Input Data Pegawai</h2>

Karena kamu membuat anchor seperti berikut ini:

<?php echo anchor("pegawai/input_data", "Input Pegawai");?>

Maka kamu harus membuat Controller pegawai dan metode input_data seperti dibawah ini:

Membuat Controller Pegawai

<?php defined('BASEPATH') OR exit('No direct script access allowed');

class Pegawai extends CI_Controller {

public function input_data()

{

$data['isi_halaman']='input_data_pegawai';

$this->load->view('template', $data);

}

}

Keterangan:

  • class Pegawai extends CI_Controller, kode ini berarti kita sudah membuat Controller Pegawai
  • public function input_data(), kode ini berarti kita sudah membuat metode input_data
  • $data['isi_halaman']='input_data_pegawai', kode ini berarti kita memberikan file input_data_pegawai.php ke index 'isi_halaman' dari array $data.
  • $this->load->view('template', $data), kode ini berarti kita memberikan nilai dari array $data ke file template.php sekaligus kita menampilkan file template.php ke browser.

Ingat:

$data['isi_halaman'], index dari array $data akan menjadi variabel pada file View, jadi index 'isi_halaman' akan menjadi variabel pada file view.

Penutup

Sekian dan terima kasih.

 

2016 © Fahmi Basya Kartapura