Tutorial CRUD C# Winforms Sederhana Menggunakan MySQL

Dibuat pada 14-09-2022


Gambar

Pendahuluan

CRUD merupakan singkatan dari CREATE (Menambah data), READ (Membaca, Menampilkan dan Mencari Data), UPDATE (Mengubah data) dan DELETE (Menghapus data) yang dimana CRUD sendiri merupakan operasi dasar dalam mengelola sebuah database menggunakan aplikasi.

Tools

Sebelum mengikuti tutorial ini, pastikan Anda sudah menginstall :

Pembuatan Database

Buatlah sebuah database dengan nama kontak. Dilanjut dengan membuat table baru dengan nama user dan untuk field-fieldnya :

  • id (INT, AUTOINCREMENT, PRIMARY KEY)
  • nama (varchar 250)
  • no_hp (varchar 15)
  • status (varchar 50)

untuk lebih jelasnya bisa lihat gambar dibawah ini

Pembuatan Database

Lalu, silahkan tambah data baru ke database agar nanti saat menampilkannya data tidak kosong. Untuk jumlah data barunya bebas, sesuka kalian mau menambahkan berapa data baru.

Pembuatan Desain Winforms

Disini saya membuat project baru seperti pada gambar dibawah ini

Pembuatan Project Baru

Jika sudah, kita akan masuk ke Visual Studio yang dimana form nya masih polos / kosong. Setelah itu, silahkan teman-teman desain seperti saya atau teman-teman bebas mau men-desain formnya seperti apa yang terpenting terdapat :

  • 2 Textbox
  • 3 Label
  • 1 Combobox
  • 3 Tombol / Button (Tambah, Ubah dan Hapus)
  • DataGridView

Sehingga untuk desain form yang telah saya buat akan menjadi seperti ini

Desain Form

Selain itu, biar tidak bingung pada bagian properties biasakan untuk mengubah Name sesuai dengan kegunaannya. Kenapa harus mengubah Name? Bila kalian memiliki tiga tombol / button, Name dari tiga button tersebut akan menjadi button1, button2 dan button3. Name tersebut akan membuat kalian bingung bila kalian mempunyai beberapa komponen yang sama dalam 1 form, oleh karena itu saya merekomendasikan kepada teman-teman untuk mengubah value properties dari Name pada setiap komponen. Untuk contohnya bisa lihat gambar

Btn Hapus

Btn Tambah

Btn Ubah

Datagrid

Selain komponen diatas, saya juga merubah properties name value pada textbox dan combobox sesuai dengan labelnya.

Membuat Fungsi

Untuk membuat fungsi, akan saya bagi menjadi 3 bagian supaya teman-teman tidak bingung. Untuk bagian pertama membuat fungsi Koneksi ke database, bagian kedua membuat Model dan ketiga membuat fungsi CRUD.

Sebelum mulai membuat fungsi, pastikan teman-teman sudah menginstall Mysql.Data yang bisa teman-teman cari pada menu Nuget Package

MySQL.Data

Membuat Fungsi Koneksi

Untuk membuat fungsi koneksi, silahkan buat file class baru dengan nama Connection, yang isi dari file tersebut seperti ini

/*
* database : Nama database yang sudah dibuat
* uid : Username
* pwd : Password
*/

// ConnectionString, bisa diubah-ubah sesuai dengan database yang dipakai
// Untuk lengkapnya bisa kesini https://www.connectionstrings.com/
string ConnectionString = "server=localhost;database=kontak;uid=root;pwd='';";
MySqlConnection con;

// Untuk membuka koneksi
public void OpenConection()
{
    con = new MySqlConnection(ConnectionString);
    con.Open();
}

// Untuk menutup koneksi setelah melakukan aktifitas terhadap database
public void CloseConnection()
{
    con.Close();
}

// Untuk eksekusi query INSERT, UPDATE dan DELETE
public void ExecuteQueries(string Query_)
{
    MySqlCommand cmd = new MySqlCommand(Query_, con);
    cmd.ExecuteNonQuery();
}

// Untuk eksekusi query
public MySqlDataReader DataReader(string Query_)
{
    MySqlCommand cmd = new MySqlCommand(Query_, con);
    MySqlDataReader dr = cmd.ExecuteReader();
    return dr;
}

// Untuk eksekusi query SELECT dan menampilkannya ke Datagridview
public object ShowDataInGridView(string Query_)
{
    MySqlDataAdapter dr = new MySqlDataAdapter(Query_, ConnectionString);
    DataSet ds = new DataSet();
    dr.Fill(ds);
    object dataum = ds.Tables[0];
    return dataum;
}

Jangan lupa tambahkan ini juga pada bagian atas

using System.Data;
using MySql.Data.MySqlClient;

Membuat Model

Setelah selesai membuat koneksi, sekarang kita lanjut membuat file class baru dengan nama Kontak_M, untuk isi dari file tersebut adalah seperti berikut


// Field
string nama, no_hp, status;

// Constructor Kosong
public Kontak_M() { }

// Constructor Isi
public Kontak_M(string nama, string no_hp, string status)
{
    this.Nama = nama;
    this.No_hp = no_hp;
    this.Status = status;
}

// Accessor Mutator
public string Nama { get => nama; set => nama = value; }
public string No_hp { get => no_hp; set => no_hp = value; }
public string Status { get => status; set => status = value; }

Membuat Fungsi CRUD

Sama seperti tahap sebelumnya, untuk membuat fungsi CRUD juga membuat sebuah file class baru dengan nama Kontak. Untuk isi dari file tersebut adalah


// Memanggil class Connection
Connection connection = new Connection();

// Method Tambah Data
public bool TambahData(Kontak_M kontak)
{
    try
    {
        connection.OpenConection();
        connection.ExecuteQueries("INSERT INTO user (nama, no_hp, status) VALUES ('" kontak.Nama + "', '" 
            + kontak.No_hp + "','" 
            + kontak.Status + "')");
        status = true;
        MessageBox.Show("Tambah Data berhasil dilakukan", "InformasiMessageBoxButtons.OK, MessageBoxIcon.Information);
        connection.CloseConnection();
    }
    catch (Exception ex)
    {
        MessageBox.Show(ex.Message, "Gagal", MessageBoxButtons.OK, MessageBoxIcon.Error);
    }
    return status;
}

// Method Ubah Data
public bool UbahData(Kontak_M kontak, string id)
{
    Boolean status = false;
    try
    {
        connection.OpenConection();
        connection.ExecuteQueries("UPDATE user SET nama='" + kontak.Nama + "'," + "no_hp='" + kontak.No_hp + "'," + "status='" + kontak.Status + "' WHERE id='" + id + "'");
        status = true;
        MessageBox.Show("Ubah Data berhasil dilakukan", "Informasi", MessageBoxButtons.OK, MessageBoxIcon.Information);
        connection.CloseConnection();
    }
    catch (Exception ex)
    {
        MessageBox.Show(ex.Message, "Gagal", MessageBoxButtons.OK, MessageBoxIcon.Error);
    }
    return status;
}

// Method Hapus Data
public bool HapusData(string id)
{
    Boolean status = false;
    try
    {
        connection.OpenConection();
        connection.ExecuteQueries("DELETE FROM user WHERE id='" + id + "'");
        status = true;
        MessageBox.Show("Data berhasil dihapus", "Informasi", MessageBoxButtons.OK,MessageBoxIcon.Information);
        connection.CloseConnection();
    }
    catch (Exception ex)
    {
        MessageBox.Show(ex.Message, "Gagal", MessageBoxButtons.OK, MessageBoxIcon.Error);
    }
    return status;
}

Implementasi

Pada tahap implementasi ini, kita akan balik lagi ke form yang sudah kita buat pada tahap Pembuatan Desain Winforms hanya saja bedanya kita tidak lagi mendesain melainkan kita akan menggunakan events yang terdapat pada komponen-komponen yang kita gunakan.

Untuk tahap Implementasi ini akan saya bagi jadi beberapa tahap, agar terlihat lebih rapih dan ter struktur.

Menampilkan Data

Untuk menampilkan data, silahkan teman-teman cari events form_load pada bagian properties atau teman-teman bisa double click form yang sudah teman-temen buat. Sehingga akan membuka sebuah event _Load seperti ini

// Form1 adalah nama Form saya
private void Form1_Load(object sender, EventArgs e)
{
    //Code disini
}

Sebelum teman-teman mengisi code pada event _Load, panggil terlebih dahulu Class yang sudah kita buat

// Memanggil class dan Membuat objek baru
Connection connection = new Connection();
Kontak kontak = new Kontak();
Kontak_M kontak_ = new Kontak_M();

// Menambahkan field id untuk menampung data id pada database
string id;

Lalu, teman-teman masukkan code berikut ke dalam event _Load tersebut

// Menambahkan item ke combobox, dengan Status sebagai name dari Combobox
// Sesuaikan Status dengan name yang teman-teman ganti
Status.Items.Add("Teman");
Status.Items.Add("Keluarga");
Status.Items.Add("Mantan");
Status.Items.Add("Gebetan");
Status.Items.Add("Pacar");

// Memanggil method ShowData untuk menampilkan data dari database ke Datagridview
ShowData();

Karena di event _Load kita memanggil method ShowData(), maka kita juga harus menambahkan method tersebut

private void ShowData()
{
    // DataKontak adalah name dari Datagridview
    // connection adalah nama objek yang kita buat untuk class Connection
    DataKontak.DataSource = connection.ShowDataInGridView("SELECT * FROM user");
}

Ketika kalian menjalankan project, seharusnya data sudah tampil. Seperti berikut Form Data


Menambahkan Data

Untuk menambahkan data, kita bisa menggunakan event _Click dari tombol tambah data, caranya sama dengan double click tombol tambah data dan akan terbuka event _Click.

Untuk code dari tombol tambah data seperti berikut

// Memanggil field nama, dari class Kontak_.
// Untuk kontak_ adalah nama objek yang kita buat untuk class Kontak_M
kontak_.Nama = Nama.Text;
kontak_.No_hp = NoHp.Text;
kontak_.Status = Status.Text;

// Memanggil method TambahData dan mengirimkan data yang berada pada objek kontak_
// kontak adalah nama objek yang kita buat untuk class Kontak
kontak.TambahData(kontak_);

// Ketika telah selesai input data, form akan kosong
Nama.Text = NoHp.Text = Status.Text = "";

// kita memanggil kembali method ShowData untuk refresh Datagridview
ShowData();

Mengubah Data

Untuk mengubah data, terdapat dua event yang digunakan yaitu pada component Datagridview dan Button / Tombol.

Event Datagridview

Untuk event ini, bisa teman-teman cari pada tab properties lalu cari icon petir dan pilih event cell_click. Kalau sudah silahkan teman-teman isi dengan code berikut

// Ketika cell di click, data yang berada pada cell akan tampil ke textbox dan combobox
id = DataKontak.Rows[e.RowIndex].Cells[0].Value.ToString();
Nama.Text = DataKontak.Rows[e.RowIndex].Cells[1].Value.ToString();
NoHp.Text = DataKontak.Rows[e.RowIndex].Cells[2].Value.ToString();
Status.SelectedItem = DataKontak.Rows[e.RowIndex].Cells[3].Value.ToString();

Event Button

Untuk event ini sama seperti tambah data, teman-teman cukup double click pada tombol ubah dan masukkan code berikut

// Memanggil field nama, dari class Kontak_.
// Untuk kontak_ adalah nama objek yang kita buat untuk class Kontak_M
kontak_.Nama = Nama.Text;
kontak_.No_hp = NoHp.Text;
kontak_.Status = Status.Text;

// Memanggil method Ubah dan mengirimkan data yang berada pada objek kontak_ dan id
// kontak adalah nama objek yang kita buat untuk class Kontak
kontak.UbahData(kontak_,id);

// Ketika telah selesai ubah data,form akan kosong
Nama.Text = NoHp.Text = Status.Text = "";

// kita memanggil kembali method ShowData untuk refresh Datagridview
ShowData();

Menghapus Data

Sama seperti kedua tombol sebelumnya, teman-teman cukup double click pada tombol hapus dan masukkan code berikut ke dalamnya

// Menampilkan pesan konfirmasi hapus data
DialogResult pesan = MessageBox.Show("Yakin mau hapus data ini?", "Info", MessageBoxButtons.YesNo, MessageBoxIcon.Question);

// Jika tombol yes, di klik maka data akan terhapus
if (pesan == DialogResult.Yes)
{
    // Memanggil method Ubah dan mengirimkan data yang berada pada id
    // kontak adalah nama objek yang kita buat untuk class Kontak
    kontak.HapusData(id);

    // kita memanggil kembali method ShowData untuk refresh Datagridview
    ShowData();
}

Penutup

Selesai sudah artikel kali ini tentang Tutorial CRUD C# Winforms Sederhana Menggunakan MySQL. Terima kasih karena sudah mampir, semoga mudah dipahami dan jangan lupa untuk minum 🍵🍵🍵.

Bonus

Buat yang belum mengerti, saya juga ada membuat vidio tutorialnya bisa di cek di Channel Youtube