Membuat aplikasi form pada Android menggunakan Cordova

Selanjutnya kita akan membuat aplikasi form input yang akan dijalankan pada smarphone Android. Kita akan menggunakan Apache Cordova untuk melakukan development.

Langkah-langkah pembuatan aplikasi Android menggunakan Apache Cordova adalah seperti berikut ini:

1. Membuat aplikasi awal misal seperti berikut ini:
   D:\cobamobile>cordova create form com.contoh.form FormInput
   Creating a new cordova project with name “FormInput” and id “com.contoh.form” at
    location “D:\cobamobile\form”
2. Tambahkan platform Android seperti contoh berikut ini:
   D:\cobamobile>cd form

   D:\cobamobile\form>cordova platform add android
   Creating android project…
   Creating Cordova project for the Android platform:
           Path: platforms\android
           Package: com.contoh.form
           Name: FormInput
           Android target: android-19
   Copying template files…
   Project successfully created.

3. Kita akan membuat form dengan source code seperti berikut ini:
               <form action=”http://www.proweb.asia/mobilepost/proses.php” method=”POST”>
               Nama : <input type=”text” name=”nama”>
               <br/>Kota : <input type=”text” name=”kota”>            
               <button type=”submit” >Kirim</button>    
               </form>

   Tambahkan coding di atas pada www\index.html, pada contoh kali ini adalah D:\cobamobile\form\www\index.html seperti berikut ini:
           <div class=”app”>
               <h1>Apache Cordova</h1>
               <div id=”deviceready” class=”blink”>
                   <p class=”event listening”>Connecting to Device</p>
                   <p class=”event received”>Device is Ready</p>
               </div>

               <form action=”http://www.proweb.asia/mobilepost/proses.php” method=”POST”>
               Nama : <input type=”text” name=”nama”>
               <br/>Kota : <input type=”text” name=”kota”>            
               <button type=”submit” >Kirim</button>    
               </form>

           </div>

4. Kemudian pada submit formnya misalnya http://www.proweb.asia/mobilepost/proses.php kita edit isinya misalnya seperti berikut ini:
   <?php
   $nama=$_POST[‘nama’];
   $kota=$_POST[‘kota’];

   echo “Nama: $nama
   <br/>Kota: $kota”;
   ?>

5. Lakukan build misalnya :
   D:\cobamobile\form>cordova build android

   BUILD SUCCESSFUL
   Total time: 51 seconds
   Built the following apk(s):
       D:\cobamobile\form\platforms\android\ant-build\CordovaApp-debug.apk

6. Copy file CordovaApp-debug.apk  (dalam contoh  D:\cobamobile\form\platforms\android\ant-build\CordovaApp-debug.apk) ke Smarphone Android, lakukan instalasi dan jalankan seperti contoh berikut ini

   
   Pilih  CordovaApp-debug.apk

   
   Silahkan pilih Install

   
   Silahkan pilih Open

   
   Silahkan mengisi nama dan kota anda.

   
   Saat anda memilih nama maka akan muncul tombol keyboard

   
   Silahkan isi Nama dan kota anda dan klik Kirim dan hasilnya akan seperti contoh berikut ini:

   
   Terlihat bahwa data sudah diproses oleh php.

Informasi lebih lanjut silahkan mengunjungi http://cordova.apache.org/docs/en/4.0.0/guide_cli_index.md.html#The%20Command-Line%20Interface .

Kunjungi www.proweb.co.id untuk menambah wawasan anda.