Using Easily ASP.NET GridView

Merasa kesulitan untuk menggunakan coding di ASP.NET untuk fitur edit maupun delete? Kita bisa menggunakan function yang sudah disediakan, jadi tidak perlu mengcoding susah – susah untuk menjalankan fitur yang kita mau.

Untitled

Contohnya seperti gambar di atas.

Terdapat gridview yang menampilkan beberapa data, jika ingin mengedit, kita cukup mengklik button “Edit” yang terdapat di sisi kiri gridview.

Untitled2

Jika kita mengklik button “Edit”, maka tampilan grid akan berubah, selain primary key, kolom lainnya berubah menjadi seperti textbox, sehingga bisa kita ganti datanya. Jika sudah selesai maka tinggal mengklik button “Update”.

Cara untuk mengubah tampilan gridview seperti di atas cukup mudah :

1. Pada saat membuat tampilan, pada gridview terdapat panah kecil di pojok kanan atas, klik panah tersebut.

Untitled4

Setelah tanda panah diklik, maka akan muncul beberapa option, pilih yang <new data source …>

2. Setelah itu, akan muncul window baru seperti dibawah ini :

Untitled5

Pilih yang Database

3. Lanjutt…

Untitled6

Pilih connection string yang digunakan, next..

4.

Untitled7

Pilih tabel mana yang akan ditampilkan anda juga bisa menambahkan syntax where dan order by di query tabel anda, lalu klik button “Advance”…

5. Akan keluar window seperti dibawah ini

Untitled8

checklist keduanya untuk mengenerate secara otomatis. OK dan next…

6. Setelah itu test query dan finish…

7. Setelah selesai, checklist “Enable updating” dan “Enable Deleting” yang secara otomatis akan menambahkan kolom button edit dan delete pada gridview anda.

Untitledx

 

One comment

  1. Kha-Zana (@kha_zana) · December 17, 2013

    Terimakasih tutorialnya bermanfaat🙂

    Masih seputar GirdView ASP.NET di blog ini ada tutorial menggunakan Conditional Binding Expression dengan ASP.NET GridView

    http://windowshosting.blogdetik.com/2013/12/17/aspnet-hosting-conditional-binding-expression-dengan-aspnet-gridview/

    Semoga artikelnya bermanfaat juga ya …🙂

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s