TUTORIAL STORE PROCEDURE PADA ASP.NET

Tutorial berikut ini akan membuat sebuah store procedure pada sqlserver 2008 , yang akan menyimapan data mahasiswa. User diharapkan dapat membuat store procedure dan dapat menggunakannya di aplikasi ASP.NET. Pertama yang harus kita lakukan adalah mendesain sebuah database yang nantinya akan menyimpan inputan dari user di dalam website sederhana. 1. Buat sebuah database menggunakan Miscrosoft SQL Server 2008/(asumsi software sudah

terinstall)

2. Buka Miscrosoft SQL Server Management Studio(SSMS), menggunakan server local yang

ada di computer kita, klik tombol connect. 3. Klik kanan NEW databse pada file database yang terdapata di Object Explorer (untuk

memunculkan klik tombol F8). Simpan dan berinama Registrasi lalu klik OK.

4. Setelah database Registrasi dibuat, create sebuah tabel baru dengan cara seperti gambar dibawah ini

5. Buat tabel tmahasiswa dengan nrp sebagai Primary Key(PK) seperti dibawah ini :

6. Buat store procedur simpan dengan nama sp_simpan dengan cara menekan tombol new query seperti di bawah ini :

7. Ketikan sintak sql seperti gambar berikut kemudian blok semua teks dan tekan tombol

execute

8. Jika berhasil maka maka akan ada keterangan Command(s) completed successfully.

9. Untuk mengecek apakah store procedure kita berhasil maka ketikan sintak seperti berikut

dengan menekan tombol execute :

10. Jika berhasil maka data yang tadi kita inputan akan masuk ke dalam tabel t mahasiswa

11. Sekarang kita akan bekarja langsung menggunakan aplikasi visual studio 2010, pertama buka aplikasi visual studio 2010 klik new project

Buatlah sebuah project baru yang pertama dengan cara klick File NewProject(Ctrl+Shift+N) seperti yang ditunjukkan pada gambar di bawah ini:

Kemudian akan tampil view window New Project seperti yang ditunjukkan pada gambar berikut:

Pilih Tools Pemrograman C#, kemudian expand(klick tanda panah kecil di samping tulisan C#) .Di bawahnya akan ditampilkan beberapa Sub Item dan salah satunya adalah WEB click item tersebut maka akan ditampilkan ASP.NET Web Application pada sisi sebelah kanan seperti terlihat pada gambar di atas. Berikan nama project Registrasi pada name Project seperti situnjukkan pada view di atas, berikan path atau address pada Location dengan meng-click button browse lalu klick Ok. Sehingga ditampilkan sebuah View Default.aspx seperti berikut ini:

Setelah itu berpindahlah ke Solution Explorer yang berada di sebelah kanan View Default.aspx dan klik kanan Default.aspx dan pilih rename seperti terlihat pada view berikut ini:

Gantikan nama Default.aspx menjadi Registrasi.aspx sehingga menjadi seperti yang ditujukkan pada gambar berikut:

Klik kanan Registrasi.aspx.cs pilih open seperti pada gambar berikut:

Setelah klik open maka akan ditampilkan sebuah view Registrasi.aspx.cs seperti berikut ini:

Klick Tab Registrasi.aspx* dan click tab design yang terletak di pojok kiri bawah(yang ditunjukkan dengan tanda panah) sehingga ditampilkan view Home default dari Registrasi.aspx seperti berikut ini:

Ubahlah(EDIT) Tampilan desain Home di atas menjadi seperti di bawah ini:

Namun sebelumnya untuk menampilkan view seperti di atas ikuti langkah sebagai berikut:

1. Ganti tulisan WELCOME TO ASP.NET dengan cara memblock tulisan tersebut dan gantikan dengan ISIKAN DATA DIRI ANDA.

2. Agar tampilan kelihatan rapi maka diperlukan table untuk mengatur tata letak dari label, button dan GridView. Caranya Drag table dari tab HTML pada ToolBox menuju ke Registrasi.aspx*.

Secara default table yang ditampilkan dengan 3 buah kolom dan 3 buah baris. Untuk mengeditnya click tab Split yang ada di samping tab Design yang fungsinya untuk menampilkan Design sekaligus kode program secara bersamaan seperti berikut ini:

Atau click tab Source yang ada di samping Split untuk menampilkan hanya kode program saja seperti yang terlihat berikut ini:

Edit code yang ada di pada view di atas sehingga dihasilkan 5 row dan 5 column pada table seperti terlihat pada design view yang diinginkan.

12. Pada panel bawah tekan tombol Desain dan buat form desain sebagai berikut:

13. Masukan juga komponen grid view di bawah tombol simpan pada panel tool box pada katagori data

14. Buat sebuah koneksi denga cara klik kanan WebApplication pilih properties

15. Pilih setting dan ganti type menjadi conntection string

16. Pilih value kemudian masukan server name dan pilih database registrasi, Tekan test connection untuk mengecek koneksi kemudian tekan OK

17. Jangan lupa tekan tombol save all untuk menyimpan settingan yang sudah kita seting tadi 18. Klik 2x File Registrasi.asxp.cs :

19. Masukan Librai berikut pada bagian header berikut ini ke dalam Registrasi.aspx.cs

20. Kemudian Masukan Kode Berikut Pada Method Page_Load

21. Buat Method GetConnectionString() dan masukan kode berikut

Cttn: WebApplication1 pada kode di atas adalah disesuaikan dengan nama Project yang sedang dikerjakan.

22. Buat Function BindGridView dan masukan kode berikut

private void BindGridView()

{ DataTable dt = new DataTable();

SqlConnection connection = new SqlConnection(GetConnectionString()); try { connection.Open(); string sqlStatement = "SELECT * FROM tmahasiswa"; SqlCommand cmd = new SqlCommand(sqlStatement, connection); SqlDataAdapter sqlDa = new SqlDataAdapter(cmd); sqlDa.Fill(dt); if (dt.Rows.Count > 0) { GridView1.DataSource = dt; GridView1.DataBind(); } } catch (System.Data.SqlClient.SqlException ex) { string msg = "Fetch Error:"; msg += ex.Message; throw new Exception(msg); } finally { connection.Close(); } }

Ctt: Method GridView digunakan untuk menampilkan data yang ada di database

23. Buat Method UpdateOrAddNewRecord beserta parameternya seperti kode berikut :

private void UpdateOrAddNewRecord(string Nrp, string Nama, string JK, string Alamat) { //Kode berikut ini digunakan untuk membuka koneksi ke database. SqlConnection connection = new SqlConnection(GetConnectionString()); string sqlStatement = string.Empty; //Untuk memanggil procedur sp_simpan sqlStatement = "exec sp_simpan @nrp,@nama,@jk,@alamat";

/** Baris berikut ini digunakan untuk memastikan coneksi ke database berjalan dengan lancer dan menangkap kesalahan yang mungkin terjadi untuk saat koneksi atau kesalah saat penginputan data oleh user.. */ try

{ connection.Open(); SqlCommand cmd = new SqlCommand(sqlStatement, connection);

/** Baris berikut ini untuk memastikan data yang dimasukkan user ke dalam fiel2 text box isian masuk sesuai tempatnya pada field table pada database */

cmd.Parameters.AddWithValue("@nrp", Nrp); cmd.Parameters.AddWithValue("@nama", Nama); cmd.Parameters.AddWithValue("@jk", JK); cmd.Parameters.AddWithValue("@alamat", Alamat); cmd.CommandType = CommandType.Text;

cmd.ExecuteNonQuery(); } catch (System.Data.SqlClient.SqlException ex) { string msg = "Insert error:"; msg += ex.Message; throw new Exception(msg); } finally { connection.Close(); } } Cttn: private void UpdateOrAddNewRecord(string Nrp, string Nama, string JK, string Alamat) kode di atas adalah method yang dibuat dengan tujuan untuk mengUpdate data yang yang dimasukkan ke dalam database Registrasi.

24. Klik 2x Object Button simpan kemudian masukan kode berikut:

Cttn: TextBox1,TextBox2 dan seterusnya adalah nama dari TextBox yang digunakan pada saat penginputan dan namanya disesuaikan dengan nama textbox yang sedang digunakan dalam program.

25. Tekan Tombol Running untuk mencoba menjalankan aplikasi dan hasilnya lebih kurang

seperti tampak pada gambar di bawah ini: