Minggu, 08 Januari 2012

RESUME PWEB PERT. 6

Membuat menu Login
  1. Pertama kita ambil 2 Panel, 2 Label, 2 Textbox, dan 2 button.
  1. Panel digunakan sebagai tempat untuk control login lainnya, Label kita beri nama Username dan Password, Textbox ID-nya kita ganti TxtUser dan TxtPass serta button text-nya kita ganti Login dan Logout.
  1. Dobel klik button Login lalu kita ketikan:
If TextBox1.Text= "admin" And TextBox2.Text = "admin" Then
            Session("User") = TextBox1.Text
            Response.Redirect("~\Home.aspx")
        Else
            TextBox1.Text = ""
            TextBox2.Text = ""
        End If

4.      Pada Header masterpage kita klik kanan kita pilih insert lalu row below. Maka akan ada baris baru yang nantinya digunakan sebagai tempat untuk menu. Setelah itu kita ambil menu dari toolbox navigation, drag ke baris baru tadi. Selanjutnya kita klik tanda [>] kita pilih edit menu item. Maka akan masuk pada menu item editor. Disini kita klik Add a root item sebanyak 4 kali, selanjutnya kita masuk properties di sebelah kanan. Item paling atas kita isi Textnya Home dan navigate urlnya ~/Home.aspx yang mengarahkan ke halaman home. Begitu seterusnya sesuaikan dengan text menu dan navigate url yang kita buat. Setelah selesai, hasilnya seperti gambar berikut ini:

  1. Pada  Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load kita ketikan:
If Session("User") = "admin" Then
            Menu1.Visible = True
            Panel1.Visible = False
            Button2.Visible = True
        Else
            Menu1.Visible = False
            Panel1.Visible = True
            Button2.Visible = False
        End If
  1. Dobel klik button Logout lalu kita ketikan:
Session("User") = Nothing
        Response.Redirect("~\Home.aspx")
  1. Selesai. Dengan ini kita sudah bisa melakukan session management login.


RESUME PWEB PERT. 5

I/O Database

Langkah insert data ke dalam database:
  1. Setelah kita membuat gridview, langkah selanjutnya yaitu memasukan data ke dalam database.
  2. Kita ambil linkbutton dan formview dari toolbox taruh ke Kategori_VCD.aspx

  1. Pada linkbutton kita ganti textnya menjadi tambah data. Setelah itu kita klik dua kali linkbutton tersebut sehingga kita masuk ke window untuk mengedit baris kode. Pada LinkButton1_Click kita ketikan FormView1.ChangeMode(FormViewMode.Insert)
  1. Pada formview kita klik [>] lalu kita klik choose data source, kita pilih sama dengan data source milik gridview
  1. Setelah itu kita pilih edit template. Pada combobox display kita pilih InsertItemTemplate. Kita hapus label ID_Kategori_VCD dan ID_Kategori_VCDTextBox kita ganti visiblenya menjadi false.
  1. Selanjutnya kita klik dua kali InsertButton sehingga kita masuk ke window untuk mengedit baris kode.
  2. Diatas Partial Class Kategori_VCD kita ketik Imports System.Data.SqlClient. Dibawah Inherits System.Web.UI.Page kita ketik Dim conn As SqlConnection dan Dim comm As SqlCommand.
  1. Setelah itu kita buat Sub generateID() yang berisi:
    Sub generateID()
        conn = New SqlConnection("Data Source=.\SQLEXPRESS;AttachDbFilename=|DataDirectory|\Database.mdf;Integrated Security=True;User Instance=True")
        conn.Open()
        comm = New SqlCommand
        comm.Connection = conn
        comm.CommandText = "SELECT MAX(ID_Kategori_VCD ) +1 AS ID_BARU FROM KATEGORI_VCD"
        CType(FormView1.FindControl("ID_Kategori_VCDTextBox"), TextBox).Text = comm.ExecuteScalar
        conn.Close()
    End Sub
  1. Pada InsertButton_Click kita ketik Sub generateID()
  1. Yang terakhir kita view in browser maka kita sudah bisa insert data ke dalam database dan automatic primary key.

RESUME PWEB PERT. 4


I/O Database

Langkah membuat database pada asp.net:
  1. Klik kanan app data pilih add new item
  1. Pilih SQL Database dengan memberi nama missalnya Rental_VCD.mdf lalu klik Add
  1.  Pada server explorer klik Rental_VCD.mdf lalu klik kanan Tables pilih add new table.
  1. Misal kita beri 2 kolom, kolom 1 yaitu ID_Kategori_VCD dengan tipe data int diberi primary key dan kolom 2 yaitu Nama_Kategori_VCD dengan tipe data varchar(50). Setelah kita kita save dan beri nama Kategori_VCD.
  1. Lalu kita masuk ke design Kategori_VCD.aspx. Kita klik table Kategori_VCD lalu kita drag ke Kategori_VCD.aspx. Akan muncul gridview Kategori_VCD.

  1. Kita klik tanda[>] di pojok kanan atas, kita centang enable editing, deleting dan selecting.
Editing digunakan untuk meng-update data di dalam grid view, Deleting digunakan untuk menghapus data di dalam gridview dan selecting digunakan untuk menampilkan data di dalam gridview.

RESUME PWEB PERT. 3


SiteMap, TreeView dan Menu
  • SiteMap digunakan untuk menampilkan struktur situs, memperlihatkan ke pengguna di mana dia berada pada struktur situs. Sebagai contoh, ketika mengunjungi seksi Novels di Amazon, suatu SiteMap akan menampilkan: Home > Books > Novels
  • TreeView digunakan untuk menampilkan struktur situs dalam bentuk tree/pohon yang bisa dibuka atau ditutup dengan menekan tanda + atau – di sebelah kiri masing-masing link.
  • Menu digunakan menampilkan struktur situs dalam bentuk menu dropdown sederhana. Bentuk ini cocok untuk situs yang tidak mempunyai banyak halaman web dan menginginkan bentuk navigasi sederhana.
Cara menggunakan sitemap di treeview:
  1. Klik kanan solution pada solution explorer, pilih Add New Item, pilih site map.
  1. Contoh pengeditan sitemap:
<siteMapNode url="~/Home.aspx" title="Home"  description="">
        <siteMapNode url="~/Kategori_VCD.aspx" title="Kategori_VCD"  description="" />
        <siteMapNode url="~/VCD.aspx" title="VCD"  description="" />
      <siteMapNode url="~/About.aspx" title="About"  description="" />
    </siteMapNode>
  1. Klik tanda [>] di pojok kanan atas treeview
  1. Klik combobox choose datasource pilih <New Data Source>
  1. Klik SiteMap maka di textbox akan muncul : SiteMapDataSource1 lalu klik ok
  1. Maka treeview tadi langsung terisi node yang sesuai dengan isi sitemap seperti