Koneksi database SQL Server dengan ASP.Net

Berikut adalah step by step membuat koneksi database SQL Server dengan ASP.Net. Untuk studi kasus kali ini, saya menggunakan SQL Server 2008R2, Buat kamu yang belum punya SQL Server silahkan download aja yaa..:)

Hasil akhir akan seperti gambar dibawah ini yaa.

1. Langkah pertama, buka project ASP yang pernah dibuat sebelumnya(baca : Tutorial input data mahasiswa dengan ASP.Net). Dibagian bawah Solution Explorer, klik 2 kali pada Web config. Lalu akan muncul form seperti gambar dibawah ini.

Gambar 1 : Web Config

<add name="ApplicationService"> sudah otomatis muncul, jadi kamu cukup menambahkan script ini :

<add name="connect_egi" providerName="System.Data.SqlClient" 

         connectionString ="Data Source=EGISAPUTRA-PC; Initial Catalog=Latihan; User ID=sa; Password=1234567" />

keterangan : 

a. <add name="connect_egi"> : Adalah nama koneksi database nya(Opsional), kamu bisa rubah sesuka hati kamu.

b. ConnectionString : adalah modul koneksi ke database. EGISAPUTRA-PC adalah nama komputer saya (sesuaikan dengan nama PC kamu yaa)

c. Initial Catalog=Latihan : Adalah nama Database yang ada/yang saya buat didalam SQL Server. Jadi kamu harus merubahnya yaa sesuai dengan nama database kamu yang akan di koneksi kan. :)

d. User ID=sa; Password=1234567 : Adalah password database kamu. Jika kamu tidak mengamankan SQL Server kamu dengan password, maka langkah ini di skip saja.

Tapi buat kamu yang mau tau cara mengamankan SQL Server, lihat di Tutorial ini yaa!!!

2. Langkah selanjutnya, kita buat form baru dengan klik kanan nama project, pilih add>New item

3. Lalu pilih Web form using masterpage, ubah nama menjadi form_grid_view(opsional), lalu klik Add. Lihat gambar dibawah ini.

 

Gambar 2 : membuat form grid

4. Setelah langkah tersebut dilakukan, maka kamu akan dapat form master page baru sesuai judul form yang kamu buat. Lihat di content3 atau quote terakhir, kamu tambahkan script ini yaa : 

<asp:GridView ID="GrvMahasiswa" runat="server" AutoGenerateColumns="False" 

    DataSourceID="SqlDataSource1">

</asp:GridView>

Kamu letakkan dibawah script ini : <asp:Content ID="Content3" ContentPlaceHolderID="ISI" runat="server">

Lebih jelasnya, lihat gambar dibawah.

Gambar 3 : Grid View

5. Jika sudah selesai menulis script diatas, langkah selanjutnya kamu klik tab design yang ada dibagian kiri bawah form itu. seperti ini.

Ganbar 4 : Step grid view

Jika benar muncul grid seperti gambar diatas, maka selamat kamu berhasil menampilkan grid di ASP. 

6. Lalu melanjutkan gambar diatas, kamu sorot hanya grid(table) nya saja saja yaa. Terdapat panah keci disebelah kanan, kamu klik. Dan pada Source data source kamu pilih New Data Source yaa. Setelah di klik maka akan muncul gambar seperti ini.

Gambar 5 : Chose Data source

7. Pilih SQL Database dan klik OK. Lalu akan muncul Pop Up Konfigurasi data source untuk memilih koneksi. Pada menu dropdown, kamu cari nama koneksi kamu yang telah kamu buat tadi di langkah 1 pada tutor ini. Pilih koneksi tersebut dan klik Next. Penampakannya seperti ini.

Gambar 6 : koneksi

8. Langkah selanjutnya, jika sukses dengan mekanisme nomor 7, maka akan muncul konfigurasi untuk memilih statement data pada database kamu. Penampakannya lihat gambar!!

Gambar 7 : Tampilan tabel

Jika telah berhasil mengikuti instruksi seperti gambar diatas, maka selanjutnya akan tampil suatu pop up untuk test query tabel.

*Keterangan : Gambar diatas adalah panduan untuk menampilkan hanya 1 tabel yang terdapat pada sebuah database. Namun jika kamu mau menampilkan lebih dari 1 tabel, maka kamu ikuti langkah berikut.

9. Untuk menampilkan lebih dari satu tabel pada sebuah database(JOIN Table) cara nya cukup mudah, dari gambar 7 (diatas) kamu pilih "Specify columns SQL statement or stored procedure" lalu next. Maka akan muncul tampilan seperti gambar dibawah ini.

Gambar 8 : Query Join 3 tabel

keterangan gambar diatas, pada SQL statement, saya memasukkan query database untul Join tiga tabel sekaligus, dengan inisial dan CASE. ini query nya :

SELECT a.mahasiswa_id, a.nama,a.NIM, b.deskripsi AS agama, a.tempat_lahir, a.tanggal_lahir,

(CASE a.jenis_kelamin

WHEN 'L' THEN 'Laki-laki'

WHEN 'P' THEN 'Perempuan'

END) AS Jenis_kelamin,

b.deskripsi AS agama,

c.nama AS nama_jurusan

FROM table_mahasiswa a

JOIN table_agama b ON a.agama_id=b.agama_id

JOIN table_jurusan c ON a.jurusan_id=c.jurusan_id;

Klik next, lalu akan muncul pop up ini.

Gambar 9 : hasil test query

Klik Finish. Lalu kembali ke Form_grid_view.aspx

10. Langkah terakhir, jalankan form_grid_view.aspx. maka akan muncul tampilan seperti ini di. Jika berhasil maka di browser anda akan muncul tampilan seperti dibawah ini.

Gambar 10 : Finish Step

Selesai :)

Sekian tutorial dari saya..
Terima kasih sudah menyimak, semoga bermanfaat. :)