Contoh CRUD dalam ASP .Net C# (Web Form)

Sebelum memulai belajar fungsi CRUD (Create Read Update Delete) dengan menggunakan C# ASP .Net, terlebih dahulu mari buat databasenya terlebih dahulu. Tutorial ini menggunakan SQL Server expres untuk pembuatan databasenya.  Pertama silakan buat database dengan nama latihan, lalu buat tabelnya dengan script seperti berikut ini.

USE [latihan]
GO
 
SET ANSI_NULLS ON
GO
 
SET QUOTED_IDENTIFIER ON
GO
 
SET ANSI_PADDING ON
GO
 
CREATE TABLE [dbo].[peserta](
	[id_peserta] [INT] IDENTITY(1,1) NOT NULL,
	[nama] [VARCHAR](30) NULL,
	[alamat] [VARCHAR](50) NULL,
	[no_telp] [VARCHAR](13) NULL,
 CONSTRAINT [PK_peserta] PRIMARY KEY CLUSTERED 
(
	[id_peserta] ASC
)WITH (PAD_INDEX = OFF, STATISTICS_NORECOMPUTE = OFF, IGNORE_DUP_KEY = OFF, ALLOW_ROW_LOCKS = ON, ALLOW_PAGE_LOCKS = ON) ON [PRIMARY]
) ON [PRIMARY]
 
GO
 
SET ANSI_PADDING OFF
GO

Setelah itu mulai membuat project baru di visual studio.  Silakan pilih yang C# –> Web Form -> Asp.Net WebForm Application

Setelah itu, buat antarmukanya seperti berikut ini : (ubah default.aspx nya )

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="EkaLatih._Default" %>
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
        <div>
            <h1>PENGELOLAAN PESERTA</h1>
            <h5>Form Peserta</h5>
            <div style="border: dotted; border-width: medium">
                <table>
                    <tr>
                        <td>Nama</td>
                        <td>
                            <asp:TextBox runat="server" ID="txtNama"></asp:TextBox></td>
                    </tr>
                    <tr>
                        <td>Alamat</td>
                        <td>
                            <asp:TextBox runat="server" ID="txtAlamat"></asp:TextBox></td>
                    </tr>
                    <tr>
                        <td>No Telp</td>
                        <td>
                            <asp:TextBox runat="server" ID="txtTelp"></asp:TextBox></td>
                    </tr>
                    <tr>
                        <td><asp:HiddenField runat="server" ID="txtId" /></td>
                        <td>
                            <asp:Button runat="server" Text="Simpan" ID="btnSimpan" OnClick="btnSimpan_Click" /></td>
                    </tr>
                </table>
            </div>
            <h5>Menampilkan Daftar Peserta</h5>
            <asp:GridView runat="server" AllowPaging="true" ID="gvPeserta" AutoGenerateColumns="false" OnRowCommand="gvPeserta_RowCommand">
                <Columns>
                    <asp:BoundField DataField="id_peserta" Visible="false" />
                    <asp:BoundField HeaderText="Nama Peserta" DataField="nama"  />
                    <asp:BoundField HeaderText="Alamat" DataField="alamat" />
                    <asp:BoundField HeaderText="Alamat" DataField="no_telp" />
                    <asp:TemplateField HeaderText="Delete">
                        <ItemTemplate>
                            <asp:LinkButton ID="LinkDelete" CommandArgument='<%# Eval("id_peserta") %>' CommandName="hapus"
                                runat="server" OnClientClick="return confirm('Apakah Anda yakin dihapus ?');">
         Delete</asp:LinkButton>
                        </ItemTemplate>
                    </asp:TemplateField>
                    <asp:TemplateField HeaderText="Edit">
                        <ItemTemplate>
                            <asp:LinkButton ID="linkEdit" CommandArgument='<%# Eval("id_peserta") %>' CommandName="ubah"
                                runat="server">
         EditS=</asp:LinkButton>
                        </ItemTemplate>
                    </asp:TemplateField>
                </Columns>
 
            </asp:GridView>
            <br />
            <asp:Label runat="server" ID="txtError"></asp:Label>
        </div>
    </form>
</body>
</html>

Lalu, masukkan kode behind nya dengan cara mengeklik kanan –> view code, masukkan script berikut ini :(ubah default.aspx.cs)

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data.SqlClient;
using System.Data;
 
namespace EkaLatih
{
    public partial class _Default : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            //Pertama-tama tampilkan daftar peserta dengan memanggil fungsi fillgvPeserta
            fillgvPeserta(); 
        }
        private DataTable getDataPeserta(int id_peserta)
        {
            try
            {
                string strKoneksi = @"Data Source=.\SQLEXPRESS;Initial Catalog=latihan;Integrated Security=True";
                SqlConnection koneksi = new SqlConnection(strKoneksi);
                koneksi.Open();
                SqlCommand command = new SqlCommand();
                command.Connection = koneksi;
                if (id_peserta == 0)
                { 
                command.CommandText = "select * from peserta";
                }else
                {
                    command.CommandText = "select * from peserta where id_peserta = @id";
                    command.Parameters.AddWithValue("@id", id_peserta);
                }
                SqlDataReader reader = null;
                reader = command.ExecuteReader();
 
                DataTable dt = new DataTable();
                dt.Load(reader);
                koneksi.Close();
                return dt;    
            }
            catch (Exception ex)
            {
                throw(ex);
            }
        }
        private bool deletePeserta(int id)
        {
            try
            {
                string strKoneksi = @"Data Source=.\SQLEXPRESS;Initial Catalog=latihan;Integrated Security=True";
                SqlConnection koneksi = new SqlConnection(strKoneksi);
                koneksi.Open();
                SqlCommand command = new SqlCommand();
                command.Connection = koneksi;
                command.CommandText = "delete from peserta where id_peserta = @id";
                command.Parameters.AddWithValue("@id", id);
                command.ExecuteNonQuery();
                koneksi.Close();
                return true;
            }
            catch (Exception)
            {
 
                return false;
            }
        }
 
        private bool insertPeserta(int id, string nama, string alamat, string telp)
        {
            try
            {
                //koneksi2 seperti ini sebenarnya bisa diringkas dan dimasukkan ke web.config, agar kalau dikemudian hari 
                //beda konfigurasinya bisa diubah cuma di web.config nya (tidak satu2)
                string strKoneksi = @"Data Source=.\SQLEXPRESS;Initial Catalog=latihan;Integrated Security=True";
                SqlConnection koneksi = new SqlConnection(strKoneksi);
 
                koneksi.Open();
                SqlCommand command = new SqlCommand();
                command.Connection = koneksi;
                //jika id nya 0 berarti kondisi fungsi ini digunakan untuk insert, maka query ke databasenya insert into bla bla bla
 
                if (id == 0) { 
                command.CommandText = "INSERT INTO [dbo].[peserta]  ([nama],[alamat],[no_telp])  VALUES (@nama, @alamat, @no_telp)";
                }
                else //jika tidak maka kondisi fungsi digunakan untuk update
                {
                    command.CommandText = "UPDATE peserta set nama = @nama, alamat = @alamat, no_telp = @no_telp where id_peserta = @id";
                    command.Parameters.AddWithValue("@id", id);
                }
                command.Parameters.AddWithValue("@nama", nama);
                command.Parameters.AddWithValue("@alamat", alamat);
                command.Parameters.AddWithValue("@no_telp", telp);
                command.ExecuteNonQuery();
                koneksi.Close();
                return true;
            }
            catch (Exception)
            {
 
                return false;
            }
        }
        private void fillgvPeserta()
        {
            try
            {
                //pertama-tama kita ambil data dari database dulu ya, terus ditampilkan ke grid view
                DataTable dt = this.getDataPeserta(0);
 
                //menampilkan ke gridview
                gvPeserta.DataSource = dt;
                gvPeserta.DataBind();
            }
            catch (Exception ex)
            {
                txtError.Text = ex.Message;
            }
        }
 
        protected void gvPeserta_RowCommand(object sender, GridViewCommandEventArgs e)
        {
            try
            {
                //custom command
                //kita tadi sudah menyiapkan dua tombol dimana satu adalah tombol untuk update, dan yang satu lagi tombol delete
                //dua tombol tadi dibedakan dari commandNamenya, coba lihat lagi baris kode untuk membuat tombol hapus dan update
                //pasti ada properties commandName.
                string jenisCommand = e.CommandName;
 
                //ini digunakan jika tombol dengan commandName ubah diklik
                if (String.Compare(jenisCommand.ToUpper(), "UBAH", true) == 0)
                {
                    txtId.Value = e.CommandArgument.ToString();
                    //ambil detail datanya untuk ditaruh di form
                    DataTable dt = this.getDataPeserta(int.Parse(txtId.Value));
                    txtNama.Text = dt.Rows[0]["nama"].ToString();
                    txtAlamat.Text = dt.Rows[0]["alamat"].ToString();
                    txtTelp.Text = dt.Rows[0]["no_telp"].ToString();
                    //ubah nama tombolnya agar pengguna tidak bingung
                    btnSimpan.Text = "Ubah";
                }
 
                //ini digunakan jika tombol dengan commandName hapus diklik
                if (String.Compare(jenisCommand.ToUpper(), "HAPUS", true) == 0)
                {
                    int id = int.Parse(e.CommandArgument.ToString());
                    bool isSukses = deletePeserta(id);
                    if (isSukses == true)
                    {
                        txtError.Text = "Data Berhasil Dihapus";
                    }
                    else
                    {
                        txtError.Text = "Data Gagal Dihapus";
                    }
                }
                //terakhir refresh tampilan di gridview peserta
                fillgvPeserta();
            }
 
            catch (Exception ex)
            {
 
                txtError.Text = ex.Message;
            }
 
        }
 
        protected void btnSimpan_Click(object sender, EventArgs e)
        {
            try
            {
                string nama, alamat, noTelp, strid;
                int id =0;
 
                nama = txtNama.Text;
                alamat = txtAlamat.Text;
                noTelp = txtTelp.Text;
                //sampai disini buat sendiri validasinya ya
                strid = txtId.Value.Trim();
 
                //jika strid kosong berarti form dalam kondisi untuk menginsert, jika ada isinya maka dalam kondisi mengupdate
                if (strid.Length > 0)
                {
                    id = int.Parse(strid);
                }
 
 
                bool isSukses = this.insertPeserta(id, nama, alamat, noTelp);
 
                btnSimpan.Text = "Simpan";
                fillgvPeserta();
                if (isSukses == true)
                {
                    txtError.Text = "Sukses Menyimpan Data";
                    //bersihkan form
                    txtNama.Text = string.Empty;
                    txtAlamat.Text = string.Empty;
                    txtTelp.Text = string.Empty;
                    txtId.Value = string.Empty;
 
                } else
                {
                    txtError.Text = "Gagal Menyimpan Data";
                }
            }
            catch (Exception ex)
            {
 
                txtError.Text = ex.Message;
            }
        }
 
        protected void gvPeserta_RowEditing(object sender, GridViewEditEventArgs e)
        {
 
        }
    }
}

Oke, Penjelasannya ada di script ya hehe, kalau yang bingung unduh aja programnya dimari (sek belum sempet upload)

8 thoughts on “Contoh CRUD dalam ASP .Net C# (Web Form)

    • gvPeserta_RowEditing berfungsi jika commandNamenya bernilai “edit”, jadi hindari nama itu jika ingin menggunakan di gvPeserta_RowCommand.
      Di tutorial tersebut commandNamenya bernama “ubah” sehingga kita bisa memasukkan scriptnya di dalam rowCommand.
      semoga membantu 😀

Leave a Comment

This site uses Akismet to reduce spam. Learn how your comment data is processed.