Sunday, 9 October 2016

Android Studio: Membuat Form Login Sederhana dan Tutorialnya

Selamat pagi, hari ini updatenya pagi-pagi karena sekarang mungkin akan sibuk di kampus dan mungkin juga mencari materi baru untuk update di blog ini. Dalam pembuatan sebuah aplikasi, aplikasi apapun mau berbasis web, desktop ataupun mobile, agar aplikasi kita interaktif dan tidak membebani hanya satu halaman saja maka akan dibuat halaman lain untuk menampung informasi agar tidak berat disatu page saja. Ada juga yang memang harus menggunakan lebih dari satu halaman. Kali ini kita akan mempelajari :
  1. Autentivikasi sederhana menggunakan if, ini sangat sederhana karena belum menggunakan database.
  2. Memanggil activity lain dari activity yang aktif, dalam artian kita akan memanggil halaman lain jika kita memasukkan username dan password yang benar. Ini sangat penting sekali nantinya jika kita membuat aplikasi yang kompleks.
  3. Memparse data dari satu halaman ke halaman lainnya. Nanti jika user berhasil login, maka usernamenya akan terlihat dihalaman selanjutnya.
Seperti apa nantinya tampilan yang akan kita buat, berikut saya sertakan screenshootnya:


Seperti itulah nantinya tampilan aplikasi yang kita buat. Untuk penjelasan source codenya kita pelajari sama-sama di bawah ini:
Di tombol bawah ini saya sertakan link download full codenya dimana kalian tinggal import saja ke android studio.

Download

Langkah pertama, buatlah sebuah activity untuk membuat form loginnya. Buatlah layoutnya seperti dibawah ini:

Jika kalian kesusahan membuat dari Design langsung, buatlah dalam bentuk xml dengan klik text yang ada dikiri bawah pada gambar dan tambahkan sintaks seperti dibawah ini:

<LinearLayout    xmlns:android="http://schemas.android.com/apk/res/android"    
xmlns:tools="http://schemas.android.com/tools"    
android:layout_width="match_parent"    
android:layout_height="match_parent"    
android:orientation="horizontal"    
android:background="@color/flat">

<EditText android:id="@+id/username"
android:layout_width="0dp"            
android:layout_weight="1"        
android:layout_height="wrap_content"        
android:hint="@string/username_id"        
android:layout_gravity="top" />

<EditText android:id="@+id/password"
android:layout_weight="1"       
android:layout_width="0dp"        
android:layout_height="wrap_content"        
android:inputType="textPassword"        
android:hint="@string/password"/>

<Button        android:layout_width="wrap_content"        
android:layout_height="wrap_content"        
android:text="@string/kirim"        
android:onClick="cobaLogin"/>

</LinearLayout>

Penjelasan codenya:
-EditText itu kita membuat field silakan kalian isi android:id supaya mudah nanti kita identifikasi pada Javanya.
-Button akan memiliki action, dimana saat button diklik akan ada validasi dari kedua text field yang kita buat. Jika username dan password benar maka akan membuka activity yang lain yang akan kita atur nanti. Yang berfungsi membuatkan action nanti yaitu android:onClick="cobaLogin"

Diatas kita sudah buat layoutnya, sekarang kita buatkan prosesnya namanya MainActivity.java
codenya seperti dibawah ini:


package com.example.maninback.login;

import android.content.Intent;
import android.provider.Settings;
import android.support.v7.app.AlertDialog;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.EditText;

public class MainActivity extends AppCompatActivity {
public final static String EXTRA_MESSAGE = "com.example.maninback.MESSAGE";
@Override protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
}
/**fungsi ini akan dipanggil saat user menekan tombol login*/
            public void cobaLogin(View view){
Intent main = new Intent(this, com.example.maninback.login.main.class);
EditText username = (EditText) findViewById(R.id.username);
EditText pass = (EditText) findViewById(R.id.password);
String namauser = username.getText().toString();
String password = pass.getText().toString();
if(namauser.equals("admin") && password.equals("admin")){
main.putExtra(EXTRA_MESSAGE, namauser);
startActivity(main);
}
else{
AlertDialog gagal = new AlertDialog.Builder(MainActivity.this).create();
gagal.setTitle("Gagal");
gagal.setMessage("Pastikan Username dan Password benar");
gagal.show();
}
}
}
Untuk penjelasan codengnya:
-EXTRA_MESSAGE : berfungsi nantinya untuk menampung nilai username yang akan diteruskan ke activity lainnya.
-Yang menjadi penentu user boleh login atau atau tidak, kalian perhatikan function cobaLogin yang menjadi action button onClick yang tadi kita buat di desainnya.

Langkah selanjutnya adalah membuat activity empty lagi caranya:


Klik kanan di app>pilih new>pilih activity> Empty Activity.
Jika sudah silakan kalian buat layoutnya lagi, kita akan buat seperti dibawah ini:


Untuk desainnya dalam bentuk xml seperti dibawah ini:


<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"    
xmlns:tools="http://schemas.android.com/tools"    
android:layout_width="match_parent"    
android:layout_height="match_parent"   
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
tools:context="com.example.maninback.login.main">

<TextView android:layout_width="wrap_content"
android:layout_height="wrap_content"        
android:textAppearance="?android:attr/textAppearanceLarge"      
 android:text="Selamat Datang"       
 android:id="@+id/textView"      
  android:layout_alignParentTop="true"       
 android:layout_centerHorizontal="true"     
   android:layout_marginTop="121dp" />

<TextView android:layout_width="wrap_content"
 android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="" 
android:id="@+id/username"
android:layout_below="@+id/textView"
android:layout_centerHorizontal="true" />

<TextView android:layout_width="wrap_content"
android:layout_height="wrap_content"  
 android:textAppearance="?android:attr/textAppearanceSmall"
 android:text="BaliDev 2016"
 android:id="@+id/textView2"
 android:layout_alignParentBottom="true" 
android:layout_alignParentStart="true" />

</RelativeLayout>
Langkah selanjutnya tinggal kalian atur di file javanya seperti dibawah ini:


package com.example.maninback.login;

import android.content.Intent;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.widget.TextView;

public class main extends AppCompatActivity {

@Override protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main2);

Intent tampil = getIntent();
String user = tampil.getStringExtra(MainActivity.EXTRA_MESSAGE);
TextView username = (TextView) findViewById(R.id.username);
username.setText(user);
}
}
Langkah selanjutnya kalian tinggal kalian edit manifestnya dan sesuaikan seperti yang bawah ini, ini cuma optional saja memang kalau salah satu activity tidak tampil saat tombol di klik.


<?xml version="1.0" encoding="utf-8"?><manifest xmlns:android="http://schemas.android.com/apk/res/android"    package="com.example.maninback.login">

<application android:allowBackup="true" android:icon="@mipmap/ic_launcher" android:label="BaliDev" android:supportsRtl="true" android:theme="@style/AppTheme">
<activity android:name=".MainActivity">
<intent-filter>
<action android:name="android.intent.action.MAIN" />

<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
<activity android:name=".main"></activity>
</application>

</manifest>
Mungkin sekian tutorial sekarang ini, memang agak panjang dan memusingkan. Saya saat pertama membuat juga seperti itu. Jad saya sarankan kalian download project diatas terus kalian coba import dan run di gadget ataupun diemulator. Setelah kalian paham coba buat sesuai dengan yang kalian inginkan.

Baca juga artikel lainnya:




Blogger: Dari hobby menulis jadi memiliki banyak keahlian

i'm bloggerSelamat malam semua, kali ini saya bercerita sedikit tentang pengalaman didunia blogging. Singkat cerita saya mulai hobby menulis diblog dari tahun 2011 sejak kelas 1 SMA berawal dari saya ingin membagikan tugas-tugas yang saya buat disekolah di blog saya yang dulu. Namun, sekarang saya tidak tahu gimana nasib blog saya yang dulu itu karena kontennya acak-acakan tidak berfokus pada satu bidang seperti saat ini. Saya memilih membuat yang baru karena sekarang lebih serius mengurusnya.

Kenapa saya membuat judul postingan seperti ini, ini merupakan pengalaman pribadi yang saya rasakan. Jika memang kalian fokus mengurus blog, pasti membuat jadwal untuk update setiap minggu sekali atau sebulan sekali untuk sebuah konten yang maksimal agar visitor tertarik dan betah di blog kita. Berikut keahlian yang mungkin dimiliki seorang blogger:
  • Memahami dunia programming terutama yang berbasis web
  • Saat pertama membuat blog/website tidak semua blogger bisa membuat tampilan untuk websitenya. Memilih template atau mencari di internet merupakan hal yang wajar dilakukan terlebih dahulu. Dari template tersebut para blogger mengedit sesuai dengan yang mereka inginkan misalkan menambahkan menu dan menambahkan label. Tentu itu akan membutuhkan waktu yang lama namun akan membuat mereka jadi terbiasa. Dari sinilah membuat semakin biasa dan memahami tag-tag yang berfungsi untuk membangun website. Hingga akhirnya bisa membuat sendiri template dan itu bisa menjadi nilai jual tersendiri buat mereka.
  • Memiliki banyak pengalaman karena sering melakukan eksperimen
  • Bagaimana jadinya kalau konten yang mereka bagikan belum pernah para blogger coba? tentu akan menyesatkan visitor yang mengalami masalah. Misalkan seorang blogger yang memposting cara memperbaiki ponsel yang bootloop, tentu mereka sudah pernah mengalami kasus yang sama sehingga meraka memposting cara memperbaikinya dan menyertakan gambar mengenai pengalaman mereka. Contoh yang lain, blogger yang khusus membuat konten pariwisata. Mereka pasti sudah pernah mengunjungi tempat wisatanya, kemudian membuat postingan mengenai pengalamannya saat melancong ke tempat tersebut.
  • Menjadi marketing yang handal
  • Secara tidak langsung, seorang blogger selalu berpikir untuk membuat konten yang menarik agar orang yang hanya melihat judul saja akan tertarik dengan kontennya. Itu membuat para blogger setiap saat menyusun strategi untuk menjaring visitor. Walaupun implementasinya seorang marketing menjaring konsumen namun tidak memungkiri seorang blogger memiliki kemampuan marketing bagus.
  • Public speaking yang bagus
  • Walaupun ini belum kerasa pada diri saya sendiri. Namun kebanyakan para blogger memiliki kosa kata yang banyak. Ini membuat para blogger bisa menjadi pembicara yang bagus.
  • Penulis yang kreatif
  • Ini merupakan aset yang wajib dimiliki seorang blogger. Kalau tidak bisa menulis bagaimana bisa buat konten? Walaupun mereka membuat blog karena merasa memiliki ilmu lebih untuk dibagikan di internet, kalau tidak bisa menulis mau membuat apa?

Terima kasih sudah berkunjung di blog yang sedehana ini, mungkin itu saja yang bisa saya bagi semoga bisa menjadi inspirasi buat kalian semua. Bagi sahabat blogger yang memiliki tambahan bisa tambahkan di kolom komentar. 

Ala Bisa Karena Terbiasa
Baca juga artikel lainnya :

Codeigniter: Insert Data ke Database dan Tutorial untuk membuatnya

Selamat siang semuanya, pada kesempatan kali ini saya akan share tentang cara memasukkan data ke tabel yang ada di database. Dalam web dinamis database itu merupakan kunci yang utama menurut saya, sedangkan untuk tampilan web itu tergantung seni programmernya. Dalam penggunaan framework, kita yang belajar dari dasar harus paham prinsip CRUD (Create, Read, Update, Delete). Istilah lain untuk Create yaitu Insert dalam artian kita menginsert data ke database dan menuju table yang akan menampung record yang kita buat.
untuk melakukan insert ini, tentu kita harus memiliki database dan satu buah table minimal. Bagi kalian memang masih awam sekali pasti tidak mengerti apa yang saya paparkan diatas, saya kasi gambaran sedikit, kita akan membuat form seperti dibawah ini yang berbasis web :
Insert Data ke Database




















Untuk source kode yang lengkap mengenai CRUD  bisa kalian download di bawah ini, namun pada postingan kali ini hanya fokus membahas Creat/Insert saja.

Download

Silakan download dahulu.
Jika kalian ingin membuat dari awal pastikan hal-hal berikut :

  • Sudah menginstall local server disini saya menggunakan XAMPP
  • Sudah membuat database yang berisi 1 tabel yang memiliki field (id, nama, alamat, kelas)
  • Sudah download file CodeIgniter dan menaruhnya di folder htdocs
Langkah pertama buatlah file header.php kemudia kalian taruh difolder application > views
ketikan sintaks seperti dibawah ini :


<!DOCTYPE html>
<html>
<head>
<title>Data Siswa</title>
<link rel="stylesheet" type="text/css" href="<?php echo base_url();?>/assets/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="<?php echo base_url();?>/assets/bootstrap/css/bootstrap.css">
</head>
<body>
<div class="navbar navbar-default">
<div class="container-fluid">
<div class="navbar-brand">
<div class="navbar-header">
<a href="#">Data Siswa</a>
</div>
</div>
</div>
</div>

<div class="row">
<div class="col-md-3"></div>
<a href="<?php echo site_url('siswa/index')?>"><div class="col-md-3 btn-danger">Daftar Siswa</div></a>
<a href="<?php echo site_url('siswa/form')?>"><div class="col-md-3 btn-primary">Tambah Data</div></a>
<div class="col-md-3"></div>
</div>
<br>


code tersebut berfungsi untuk membuat navigasi bar supaya kelihatan lebih bagus.
Masih dalam folder yang sama kalian buat footer.php dan codenya seperti dibawah ini:

<div class="navbar-fixed-bottom" style="bottom: 0; text-align: center;">
<div class="panel-footer"><a href="http://balideveloper.blogspot.co.id/"><p>BaliDev 2016 (ManInback17)</p></a></div>
</div>
</body>
</html>

Sesuai dengan namanya code diatas untuk membuat footer yang fixed dibawah.

Pada langkah ini kalian buat vsiswa.php masih dalam folder yang sama.


<?php require('header.php') ?>
<div class="container">
<div class="row">
<div class="col-md-3"></div>
<div class="col-md-6">
<div class="form-group">
<?php
echo form_open('siswa/insert');
$inputID=array(
'type' => 'input',
'name' => 'id',
'maxlength' => '25',
'class' => 'form-control'
);
echo "<label>ID Siswa</label>";
echo form_input($inputID);
$inputNama=array(
'type' => 'input',
'name' => 'nama',
'class' => 'form-control'
);
echo "<label>Nama Siswa</label>";
echo form_input($inputNama);

$inputAlamat=array(
'type' => 'input',
'name' => 'alamat',
'class' => 'form-control'
);
echo "<label>Alamat Siswa</label>";
echo form_input($inputAlamat);

$inputKelas=array(
'type' => 'input',
'name' => 'kelas',
'class' => 'form-control'
);
echo "<label>Kelas</label>";
echo form_input($inputKelas);
echo "</br>";
$inputBtn = array(
'type' => 'submit',
'value' => 'submit',
'class' => 'btn btn-danger'
);
echo form_input($inputBtn);
$inputReset = array(
'type' => 'reset',
'value' => 'Batal',
'class' => 'btn btn-danger'
);
echo form_input($inputReset);

echo form_close();
?>
</div>
</div>
</div>
</div>
</div>
<?php require('footer.php'); ?>

Penjelasannya:
-Pada code baris pertama kita memanggil header.php yang telah kita buat tadi supaya menyatu dengan formnya dalam satu halaman.
-Pada code baris terkahir kita memanggil footer.php yang telah kita buat tadi.
-echo form_open('siswa/insert'); berfungsi untuk memanggil class yang bernama siswa yang memiliki function insert(). Kalau pakai html biasa maka penulisan untuk form tidak seperti itu, karena kita menggunakan CodeIgniter codenya dipersingkat dengan maksud yang sama.

Langkah selanjutnya akan kita buatkan kontrolernya yang nanti berfungsi untuk menampung nilai dari form yang akan diteruskan ke model.

Buat file bernama Siswa.php dan taruh di folder controllers

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

class Siswa extends CI_Controller {

public function __construct()
{
parent::__construct();
$this->load->library('table');
$this->load->model('msiswa');
}

public function index()
{

$data['data_siswa'] = $this->msiswa->lihat_siswa();
$this->load->view('vdaftarsiswa', $data);

}
public function insert(){
$data = array(
'id' => $this->input->post('id'),
'nama' => $this->input->post('nama'),
'alamat' => $this->input->post('alamat'),
'kelas' => $this->input->post('kelas')
);
$this->msiswa->qinsert($data);
redirect('siswa/index');
}


function insert itulah yang menampung semua informasi dari form yang nanti akan diteruskan ke model dengan sintaks :$this->msiswa->qinsert($data); dari model akan diteruskan ke database kita.

langkah selanjutnya buatlah file msiswa.php dan taruh di folder application>models ini berfungsi meneruskan data ke database.

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

class Msiswa extends CI_Model {

public $variable;

public function __construct()
{
parent::__construct();

}

public function qinsert($data){
$this->db->insert('siswa', $data);
}



lihat function qinsert, dalam CodeIgniter semua query dipersingkat karena sudah dukungan library yang bagus. $this->db->insert('siswa', $data);, siswa merupakan nama table dan $data adalah data dari controller yang kita buat tadi.

Sekian, mungkin agak susah memang dimengerti. Saran saya download source code yang lengkap di tombol download diatas, kalian coba terlebih dahulu dan melalui tutorial ini kalian buat sesuai dengan versi kalian masing-masing. Jika ada kendala silakan tambahkan di komentar atau bisa PM saya langsung di Facebook atau twitter.

Baca artikel lainnya:
Android Studio : Menampilkan website atau blog kalian di aplikasi android buatan sendiri
Tutorial Basic CRUD dengan Framework PHP CodeIgniter
Belajar CodeIgniter : Cara menghilangkan index.php pada url Framework CodeIgniter

Friday, 7 October 2016

Android Studio : Menampilkan website atau blog kalian di aplikasi android buatan sendiri

Selamat pagi, sudah lebih 2 hari gak update ni karena sibuk kuliah dan kemarin ada sertifikasi office advance yang lumayan membuat saya pusing. Pada kesempatan kali ini saya akan share cara menampilkan website atau blog pribadi kalian di aplikasi android buatan kalian sendiri. Supaya lebih semangat, ini saya kasi tampilannya dulu seperti apa.
android splashscreenandroid webview


Nah, seperti itulah tampilannya. Bagi kalian yang tertarik di link download bawah ini akan saya sertakan dahulu link downloadnya.


    Download

Silakan kalian download terlebih dahulu dan import projectnya ke Android Studio di PC/Laptop kalian masing-masing.Bagi kalian yang masih awam atau pemula sama seperti saya berikut langkah-langkah untuk  mengcustom project tersebut agar sesuai dengan keinginan kalian.

  1. Mengganti gambar splashscreen : Seperti yang kalian lihan pada screenshoot yang pertama diatas yang menggunakan tulisan Balidev tersebut bisa kalian ganti dengan gambar kalian sendiri, resolusi yang saya sarankan yaitu 800 x 1280 pixel. Buat dalam ekstensi JPG atau PNG buat dengan nama splash. Langkah selanjutnya kalian replace punya saya. Letak foldernya di screenshoot dibawah ini 
    tempat direktori splashscreen
  2. Mengganti nama BALIDEV pada header main aplikasi, coba lihat di screenshoot gambar kedua. Pojok kiri atas terdapat tulisan logo BALIDEV itu bisa kalian ganti tetapi harus masuk ke android studio dan project sudah kalian import.manifest androidganti android:label ="BaliDev" dengan selera kalian. Mungkin sesuai nama blog atau website kalian masing-masing.
  3. Mengganti webview url sesuai dengan url website atau blog kalian. Masuk ke MainActivity.java pada webview.loadUrl ("http://www.example.com"); 
  4. Silakan kalian run project kalian masing-masing ke ponsel android kalian masing-masing.
Sekian tutorial kali ini, untuk update pembuatan webview secara spesifik akan saya update nanti. Nanti juga akan saya buatkan cara untuk mengganti logo aplikasi android yang kalian buat supaya enak terlihat di launcher ponsel kalian. Sekian dan terima kasih, jika ada masalah dengan link atau apapun silakan berbagi disini saya juga pemula di programming walaupun basic saya di programming tapi saya menekuninya baru dari 6 bulan yang lalu, jadi saya share disini adalah project kecil yang sudah pernah saya coba. Untuk link download yang bermasalah bisa kalian tanyakan langsung di Facebook saya dan komen dibawah. Saya sangat menghargai kritik dan saran untuk kemajuan kita bersama. Jika ada kesalahan mohon dikritik langsung dan kasi saran agar bisa saya perbaiki.
Ala Bisa Karena Terbiasa

Jangan lupa, baca artikel lainnya:




Tuesday, 4 October 2016

Belajar CodeIgniter : Cara menghilangkan index.php pada url Framework CodeIgniter

Selamat siang, pada kesempatan kali ini saya akan share tentang cara menghilangkan index.php di url saat kamu menggunakan framework CodeIgniter.
Berawal dari belajar framework CodeIgniter saya mendapat banyak masalah pada redirect page yang saya buat, akhirnya saya menemukan masalahnya pada url saya masih ada index.php. Selain itu menghilangkan index.php ini juga mempercantik url kita. Ok, langsung saja akan saya share tutorialnya:

  • Buatlah file bernama .htaccess di root folder dimana file CInya berada. Contohnya pada folder saya seperti dibawah ini:
tempat direktori htaccess codeigniter
  • Kalian bisa gunakan text editor apapun, dalam filenya kalian isi sintaks seperti ini:

<IfModule mod_rewrite.c>
RewriteEngine On
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^(.*)$ index.php/$1 [L]
</IfModule>


silakan kalian save.


  • Silakan kalian ubah confignya, yang berada pada folder application->config->config.php pada $config['index_page'] hapus index.phpnya.

Jika kalian belum mengerti, dibawah ini saya sertakan file .htaccess yang saya buat.


Download      Download    Download
Baca artikel lainnya:
Tutorial Basic CRUD dengan Framework PHP CodeIgniter
Menghasilkan Uang (Pulsa) di Ponsel Android dengan Aplikasi CashTree
Project UAS Point of Sales (Transaksi) dengan native PHP

Belajar Codeigniter : Membuat Kalkulator Sederhana dengan Framework CodeIgniter dan jQuery Ajax

tampilan bootstrap kalkulator simpleSelamat pagi, pada kesempatan kali ini sambil mendengar penjelasan dosen saya akan share tentang penggunaan framework codeigniter dalam pembuatan kalkulator yang sederhana berbasis web. Kalkulator ini menggunakan dua input field yang berfungsi untuk menampung bilangan pertama dan bilangan kedua juga ada combobox untuk pilihan operator aritmatikanya (+,-, *, /).
Tampilan kalkulator yang saya buat seperti dibawah ini:
tampilan kalkulator sederhana
Kalkulator CI


Untuk penjelasan masing-masing source code
Buatlah controler dengan nama Kalkulator.php syntaksnya buat function hitung seperti dibawah ini

class Kalkulator extends CI_Controller {

public function __construct()
{
parent::__construct();
}

public function index()
{
$this->load->view('vkalkulator');
}
public function hitung()
{
$bil1 = $this->input->post('bil1');
$bil2 = $this->input->post('bil2');
$hitung = $this->input->post('hitung');
$hasil = 0;
if($hitung == '+'){
$hasil = $bil1 + $bil2;
}
if ($hitung == '-') {
$hasil = $bil1 - $bil2;
}
if ($hitung == '*') {
$hasil = $bil1 * $bil2;
}
if ($hitung == '/') {
$hasil = $bil1 / $bil2;
}
$nilai['hasil'] = $hasil;
echo json_encode($nilai);

}

}

fungsi dari function hitung() adalah menampung nilai yang ditransfer oleh form yang berasal dari view yang akan kita buat.

Tahap selanjutnya kita akan membuat view buatlah file di folder views dengan nama Vkalkulator.php
untuk formnya kita buat sintaks seperti dibawah ini:
<html>
<head>
<title>Kalkulator</title>
<link rel="stylesheet" type="text/css" href="<?php echo base_url();?>/assets/bootstrap/css/bootstrap.min.css">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$(".submit").click(function(event) {
event.preventDefault();
var bilangan1 = $("#bil1").val();
var bilangan2 = $("#bil2").val();
var option = $("#hitung").find("option:selected").val();

jQuery.ajax({
type: "POST",
url: "<?php echo base_url(); ?>"+"index.php/kalkulator/hitung",
dataType: 'json',
data: {bil1: bilangan1, bil2: bilangan2, hitung:option},
success: function(res) {
jQuery("#value").html(res.hasil);
}
});
});
});
</script>
</head>
<body>
<div class="container" style="margin-top: 100px; margin-left: 250px">
<div class="row">
<div class="col-sm-6 col-md-4">
<div class="thumbnail">
<p>Kalkulator</p>
<?php
echo form_open();
$bil1 = array(
'class' => 'from-control',
'type' => 'number',
'name' => 'bil1',
'id' => 'bil1'
);
echo form_input($bil1);
echo "<br>";
echo "<br>";
$bil2 = array(
'class' => 'from-control',
'type' => 'number',
'name' => 'bil2',
'id' => 'bil2'
);
echo form_input($bil2);
echo "<br><br>";
?>
<select id="hitung">
<option value="+">+</option>
<option value="-">-</option>
<option value="*">*</option>
<option value="/">/</option>
</select>
<?php
echo "<br> <br>";
echo form_submit('submit', 'Hasil', "class='btn btn-danger submit'");

echo form_close();
?>
</div>
</div>
<div class="row">
<div class="col-sm-6 col-md-4">
<div class="thumbnail">
<center>
<h1>Hasil:</h1>
<h1 id="value"></h1>
</div>
</center>
</div>
</div>
</div>
</body>
</html>


Tahap selanjutnya kalian perhatikan bagian script yang mengatur ajaxnya, yang paling penting menurut saya adalah url dari function di kontroller yang kita buat, kalau itu salah akan membuat function tidak berjalan. untuk yang lainnya menurut saya menggunakan penerapan jQuery seperti biasa. Berikut script diatas yang lebih jelasnya, ini harus kalian tambahkan:


<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$(".submit").click(function(event) {
event.preventDefault();
var bilangan1 = $("#bil1").val();
var bilangan2 = $("#bil2").val();
var option = $("#hitung").find("option:selected").val();

jQuery.ajax({
type: "POST",
url: "<?php echo base_url(); ?>"+"index.php/kalkulator/hitung",
dataType: 'json',
data: {bil1: bilangan1, bil2: bilangan2, hitung:option},
success: function(res) {
jQuery("#value").html(res.hasil);
}
});
});
});
</script>


Mungkin sekian tutorial kali ini, untuk script lengkap bisa kalian download dibawah ini:

Download      Download    Download


Baca artikel lainnya:
Tutorial Basic CRUD dengan Framework PHP CodeIgniter
Menghasilkan Uang (Pulsa) di Ponsel Android dengan Aplikasi CashTree
Project UAS Point of Sales (Transaksi) dengan native PHP

Monday, 3 October 2016

Hal yang kamu rasakan jika kamu belajar Programming

Halo, Selamat pagi, pada kesempatan kali ini saya akan share mengenai pengalamat saya waktu pertama belajar pemrograman walaupun sekarang masih belajar sih. Programming merupakan sebuah ilmu yang berfokuskan kepada Rekayasa Perangkat Lunak Komputer. Pada saat pertama kuliah dan saya mengikuti mata kuliah algoritma. Saya sangat bingung, saya ini belajar apa dan buat apa?
Setelah lama mengikuti dan mencari informasi di internet akhirnya saya mengerti dan pada saat ujian pertama nilai saya sangat anjlok karena memang saya enggak tahu apa-apa. Setelah lama belajar berikut hal-hal yang saya rasakan :
  • Laptop atau Komputer menjadi teman yang paling sering menemani hidupmu.
  • Kita akan selalu berhadapan dengan komputer setiap membuat tugas dan pada saat jam kuliah, yang saya rasakan kalau tanpa laptop saya hidup akan terasa hambar. Karena setiap saat berhadapan dengan komputer kamu akan jadi sering trouble dengan komputermu dak hikmahnya kamu bisa memperbaiki komputer dan membantu masalah-masalah komputer temenmu yang tidak pada bidang komputer (Jurusan lain).
  • Koneksi Internet adalah hidupmu.
  • Sedikit lebay memang, akan tetapi ini real yang saya rasakan. Sebagai seorang pemula di dunia programming saya harus terus mencari tahu tentang tugas-tugas perkuliahan dan masalah yang saya hadapi saat mencoba membuat program. Semua memang ada dibuku, kalau saya mencari dibuku maka saya akan kewalahan dan kekurangan waktu. Tapi, saya rekomendasiin kalain untuk sempatin membaca buku jika ada waktu luang.
  • Tidurmu sering terganggu.
  • Saat kamu membuat program dan ternyata programmu itu ada bug, maka kamu akan mentrace sampai bug teratasi. Biasanya kita memperbaiki satu bug bisa berimbas pada codinganmu yang lainnya. Tentu itu akan menguras tenaga dan membuat waktu tidurmu terganggu. Pengalaman saya pernah bergadang selama 4 hari untuk membuat project dan itupun pas dipresentasikan masih ada celah sehingga nilai berkurang.
  • Banyak belajar ilmu lain.
  • Saat kamu mebuat program laporan akuntansi maka otomatis kamu akan mempelajari ilmu akuntansi. Gimana tidak? kalau nggak belajar yah kamu bingung saat membuat program. Walaupun nanti kamu akan konsultasi dengan pihak customer. Dan saat kamu membuat program e-commerce maka ilmu matematikamu harus jalan juga. Untuk yang lain bisa kalian tambahkan sendiri.
  • Menjadi orang yang sabar
  • ya itulah yang terakhir, sebenarnya dalam kondisi apapun kita harus bersabar. Namun dalam mengatasi bug kita menghadapi hal yang sangat sulit apalagi sudah deadline. saya sarankan kalian sabar saja dan banyakin makan.
Mungkin sekian yang bisa saya sharing, mungkin nanti bisa kalian tambahkan juga di kolom komentar. Mungkin terlihat sedikit ribet, tapi kalau kalian tekut menjalaninya dan enjoy dengan apa yang kalian pilih, saya yakin kalian bisa menjadi programmer yang hebat dalam mengatasi masalah-masalah.


Baca Artikel Lainnya :
Tutorial Basic CRUD dengan Framework PHP CodeIgniter
Menghasilkan Uang (Pulsa) di Ponsel Android dengan Aplikasi CashTree
Project UAS Point of Sales (Transaksi) dengan native PHP