Senin, 30 April 2012

Menampilkan data pada table menggunakan DataGridView – Visual C++


Menampilkan sebuah data merupakan salah satu fungsi dari sebuah aplikasi. Tampilan data tersebut banyak macamnya, terutama data teks. contohnya saja, menampilkan data mahasiswa pada sebuah tabel. Untuk menampilkan data pada sebuah tabel bisa digunakan berbagai mecam tool, seperti kombinasi label yang disusun pada sebuah tableLayoutEditor ataupun langsung menggunakan tool yang dikhususkan untuk menampilkan data pada sebuah tabel yaitu DataGridView. DataGridView ini bisa digunakan untuk menampilkan data yang berasal dari inputan maupun data yang berasal dari sebuah data base.


Pada postingan kali ini, akan dibahas mengenai penggunaan DataGridView untuk menampilkan data yang dimasukkan oleh pengguna aplikasi. Data tersebut diinputkan melalui beberapa textbox yang kemudian akan ditampilkan kembali pada sebuah tabel yang merupakan DataGridView.
Untuk menampilkan data kedalam bentuk tabel menggunakan dataGridView, kita harus menambahkan dan mengatur kolom yang akan ditampilkan pada dataGridView tersebut. Saat pertama kali kita meletakkan dataGridView di jendela design (form.design), tampilan dataGridView masih polos dan belum terdapat kolom serta barisnya. Agar bisa digunakan kita harus membuat dahulu kolomnya dengan cara menekan tombol panah kecil yang terletak di sebelah kanan atas dataGridView yang telah kita letakkan di form design. Setelah itu akan muncul menu view, lalu pilih “add column”.












Setelah itu akan muncul window add column, yang digunakan untuk menambahkan dan mengatur kolom yang akan kita tambahkan. Pada window tersebut kita diminta memasukkan nama dari kolom dan tampilan nama yang ada di header kolom yang akan kita buat serta tipe kolomnya.




Setelah menambahkan dataGridView dan beberapa tool seperti textbox, label dan button, maka desain tampilan yang dibuat adalah sebagai berikut :



Setelah membuat design tampilan seperti gambar diatas, klik 2 kali pada button1 sehingga tampilan akan berpindah ke tampilan form.cs yang menampilkan jendela dimana kita akan membuat program.
Pada saat berpindah ke jendela program dengan meng-klik 2 kali pada button, kita akan langsung diarahkan pada fungsi button1_Click yang mana fungsi ini akan menangani event button click, yaitu event yang akan dijalankan jika button1 ditekan.
Pada fungsi button1_Click tersebut ketikkan program dibawah ini :

//pencabangan, untuk mengecek isi textBox apakah kosong atau tidak
if(textBox1->Text!="" && textBox2->Text!="" && textBox3->Text!=""){
      
//menambahkan data kedalam tabel (dataGridView)
       dataGridView1->Rows[i]->Cells[0]->Value=j.ToString();
       dataGridView1->Rows[i]->Cells[1]->Value=textBox1->Text;
       dataGridView1->Rows[i]->Cells[2]->Value=textBox2->Text;
       dataGridView1->Rows[i]->Cells[3]->Value=textBox3->Text;
                            
       //increment nilai i dan j
       i++;
       j++;
}
else{
       //menampilkan messageBox
       MessageBox::Show("Isi textBox terlebih dahulu", "Error");
}

Program tersebut merupakan program yang digunakan untuk mengisi data kedalam baris ke-I dan kolom ke 0, ke 1, ke 2 dan ke 3 yang ada pada dataGridView, dimana i merupakan sebuah variabel global.
Sebelum program dijalankan, terlebih dahulu deklarasikan variabel global i dan j bertipe static integer dengan nilai awal i=0 dan j=1. Nilai i digunakan untuk mengisi data ke row/baris berikutnya, sedangkan j merupakan nilai yang digunakan untuk mengisi kolom “No”.
Kemudian tambahkan sebuah event form_load, dengan cara klik 2 kali pada tampilan form di jendela form.design. pada fungsi form_Load, tambahkan program untuk menginisialisasikan jumlah baris dataGridView/tabel, dengan cara menambahkan program seperti berikut ini :
                      
//mendefinisikan jumlah baris pada tabel (dataGridView)
dataGridView1->RowCount=5;

setelah itu, coba jalankan aplikasi dan silahkan isi textbox kemudian tekan button/tombol simpan data. Setelah penekanan tombol, maka data pada textbox yang telah diisikan tadi akan ditampilkan pada dataGridView.

hasil output aplikasi :



0 komentar:

Posting Komentar