ASP.NET Hosting Indonesia – Cara Menggunakan ASP.NET 3.5 ListView & DataPager

ASP. NET 3.5 memperkenalkan dua data baru terikat kontrol ListView & DataPager. ListView Web server kontrol memungkinkan kita untuk menampilkan data dari sumber data dan jika DataPager terpasang maka memungkinkan paging di ListView.

ListView adalah bound control data yang mirip dengan DataList dan DataRepeater controls tetapi memberikan mengedit, insert, dan delete, semacam operasi pada data yang dibatasi seperti kontrol GridView. Tidak seperti kontrol ListView GridView memberikan pengguna kontrol penuh atas render halaman. menggunakan template dan gaya (CSS) pengguna dapat menghasilkan UI HTML bersih sesuai dengan kebutuhannya.

DataPager kontrol Web digunakan untuk data halaman dan kontrol navigasi tampilan untuk kontrol data-bound yang menerapkan IPageableItemContainer interface.ListView mengimplementasikan IPageableItemContainer dan akan menggunakan DataPager untuk mendukung Pager. Dalam tutorial ini kita akan menggunakan kedua kontrol untuk mencapai email Viewer terlihat dan terasa seperti gambar di bawah ini.

Binding ListView ke DataSource.

Kita dapat menggunakan ASP.NET datasource control data untuk mengikat ke ListView control dengan menyetel properti DataSourceID dari ListView Control dengan nama kontrol DataSource.

Sampel ini menggunakan kontrol AccessDataSource untuk mengikat ke  ListView Control .

ListView menyediakan dibangun untuk semacam fungsi,  yang dapat ditentukan dengan menetapkan properti commandname dari kontrol, yang merupakan bagian dari  ListView Control ke ‘Sort’. Yang dapat digunakan untuk mengidentifikasi pengendalian mengangkat peristiwa semacam itu. Handler untuk acara semacam terdaftar dengan menyetel properti OnSorting dari ListView untuk nama handler.

Menentukan Urutkan acara pada Control

Handling the raised sort event

protected void ListView1Sorting(Object sender, ListViewSortEventArgs e)
{
String strImage;
if (e.SortDirection == SortDirection.Ascending)
strImage = “asc.gif”;
else
strImage = “desc.gif”;
Image sortSender = (Image)ListView1.FindControl(“Image1″);
Image sortSubject = (Image)ListView1.FindControl(“Image2″);
Image sortRecdate = (Image)ListView1.FindControl(“Image3″);
Image sortBody = (Image)ListView1.FindControl(“Image4″);

if (e.SortExpression == “From”)
{
sortSender.ImageUrl = strImage;
sortSender.Visible = true;
sortSubject.Visible = false;
sortRecdate.Visible = false;
sortBody.Visible = false;
}
else if (e.SortExpression == “Subject”)
{
sortSubject.ImageUrl = strImage;
sortSender.Visible = false;
sortSubject.Visible = true;
sortRecdate.Visible = false;
sortBody.Visible = false;
}
else if (e.SortExpression == “recdate”)
{
sortBody.ImageUrl = strImage;
sortSender.Visible = false;
sortSubject.Visible = false;
sortRecdate.Visible = true;
sortBody.Visible = false;
}
else if (e.SortExpression == “Body”)
{
sortBody.ImageUrl = strImage;
sortSender.Visible = false;
sortSubject.Visible = false;
sortRecdate.Visible = false;
sortBody.Visible = true;
}
else
{

sortSender.Visible = false;
sortSubject.Visible = false;
sortRecdate.Visible = false;
sortBody.Visible = false;
}
}

Menentukan Template ListView

- LayoutTemplate

- ItemTemplate

- ItemSeparatorTemplate

- GroupTemplate

- GroupSeparatorTemplate

- EmptyItemTemplate

- EmptyDataTemplate

- SelectedItemTemplate

- AlternatingItemTemplate

- EditItemTemplate

- InsertItemTemplate

 

Main Layoout dari ListView Control  dibuat dengan mendefinisikan LayoutTemplate .  LayoutTemplate akan mencakup kontrol yang bertindak sebagai tempat untuk data seperti Tabel, Panel, Label atau HTML kontrol seperti elemen tabel, div, atau rentang yang memiliki atribut runat diatur ke “server”.
Item Template adalah template utama yang akan menampilkan data dibatasi untuk ListView secara berulang. Template ini biasanya berisi kontrol yang merupakan data-terikat kolom data atau elemen data individu lainnya. Kedua template wajib.
GroupTemplate akan digunakan untuk kelompok item. The EditItemTemplate, SelectedItemTemplate, InsertItemTemplate ditampilkan di bahwa operasi tertentu seperti insert, mengedit, pilih. Item SeparatorTemplate, Grup SeparatorTemplate digunakan untuk memisahkan setiap item dan item kelompok terpisah.
Kami akan menggunakan setiap template untuk menanamkan kontrol HTML yang diperlukan seperti meja, tr, td, div, rentang atau server kontrol untuk menampilkan UI sesuai dengan kebutuhan kita.
Contoh berikut menunjukkan struktur dasar dari ListView dengan template wajib …

Sebuah pengganti barang harus ditentukan pada ListView. Ini akan ditentukan dalam LayoutTemplate atau GroupTemplate.

Dalam rangka untuk menentukan pengganti barang menetapkan kontrol properti ID untuk “itemPlaceholder”. Kontrol barang pengganti juga harus menentukan runat = “server”. Jika Anda ingin memberikan ID yang berbeda, Anda dapat menentukan menggunakan atribut ItemPlaceholderID dari kontrol ListView.

Jika Pengelompokan digunakan, GroupTemplate akan bertindak sebagai tempat dudukan untuk ItemTemplate. Dalam hal ini Groupplaceholder harus ditentukan dalam ListView. Sebuah Groupplaceholder dapat ditentukan dalam LayoutTemplate dengan menetapkan kontrol properti ID untuk “groupPlaceholder” atau menetapkan atribut GroupPlaceholderID dari kontrol ListView untuk kontrol yang ditentukan dalam LayoutTemplate.

Contoh kode untuk setting ID  properties control untuk “itemPlaceholder”, “groupPlaceholder”

<asp:ListView runat=”server” ID=”ListView1″
DataSourceID=”SqlDataSource1″
GroupItemCount=”5″>
<LayoutTemplate>
<table runat=”server” id=”table1″>
<tr runat=”server” id=”groupPlaceholder”  >
</tr>
</table>
</LayoutTemplate>
<GroupTemplate>
<tr runat=”server” id=”tableRow”>
<td runat=”server” id=”itemPlaceholder” />
</tr>
</GroupTemplate>
<ItemTemplate>
<td id=”Td1″ runat=”server”>
<%– Data-bound content. –%>
<asp:Label ID=”NameLabel” runat=”server”
Text=’<%#Eval(“Name”) %> />
</td>
</ItemTemplate>
</asp:ListView>

Contoh kode untuk setting itemPlaceholderID, groupPlaceholderID untuk propertis control ID

<asp:ListView runat=”server” ID=”ListView1″
DataSourceID=”SqlDataSource1″
GroupItemCount=”5″ GroupPlaceholderID=”Placeholder1″ ItemPlaceholderID=”Placeholder2″>
<LayoutTemplate>
<table runat=”server” id=”table1″>
<tr runat=”server” id=”Placeholder1″>
</tr>
</table>
</LayoutTemplate>
<GroupTemplate>
<tr runat=”server” id=”tableRow”>
<td runat=”server” id=”Placeholder2″ />
</tr>
</GroupTemplate>
<ItemTemplate>
<td id=”Td1″ runat=”server”>
<%– Data-bound content. –%>
<asp:Label ID=”NameLabel” runat=”server”
Text=’<%#Eval(“Name”) %> />
</td>
</ItemTemplate>
</asp:ListView>

 

 

Mempersiapkan LayoutTemplate untuk Email Viewer

Kita perlu menciptakan LayoutTemplate seperti yang ditunjukkan di bawah ini menggunakan kontrol HTML yang diperlukan seperti meja, tr, td (dengan gaya) untuk memformat dan Kontrol ASP.Net Server (Buttons, LinkButtons, DataPager) untuk menampilkan judul serta footer. Kita perlu menggunakan itemplaceholder untuk menampilkan item dari sumber data.

 

Mempersiapkan DataPager
DataPager kontrol digunakan untuk halaman data dan untuk menampilkan kontrol navigasi untuk kontrol data-bound yang mengimplementasikan interface IPageableItemContainer.
Sebuah kontrol DataPager dapat dikaitkan dengan kontrol data-bound dengan menggunakan Halaman Kontrol ID properti. Atau, kontrol DataPager dapat ditempatkan di dalam hirarki kontrol data-bound.
kontrol DataPager akan menampilkan kontrol navigasi dengan menambahkan bidang pager untuk kontrol. DataPager mendukung berikut jenis bidang pager.
NextPreviousPagerField: Memungkinkan untuk menavigasi melalui halaman satu halaman pada satu waktu, atau untuk melompat ke halaman pertama atau terakhir. Ini menunjukkan pertama, prev, next, tombol terakhir. Jenis tombol mungkin Button, Gambar, LinkButton.

NumericPagerField: memungkinkan untuk menavigasi melalui halaman dengan menampilkan nomor halaman pada DataPager tersebut.

TemplatePagerField: kita dapat membuat UI kustom dengan menggunakan TemplatePagerField. Kita dapat menggunakan Label, tombol, gambar untuk membuat UI kustom serta pengendalian program dari DataPager.

 

Dalam rangka untuk menciptakan DataPager sesuai dengan gambar di atas kita perlu menggunakan NumericPagerField serta TemplatePagerField sebagai bagian dari DataPager Fields. Kita dapat menggunakan properti DataPager kontrol seperti PageSize, TotalRowCount, StartRowIndex untuk menciptakan TemplatePagerField.

 

PageSize memberikan tidak ada halaman yang sedang ditampilkan di DataPager.

TotalRowCount adalah tidak ada baris yang disajikan dalam sumber data melekat pada DataPager.

StartRowIndex adalah indeks pertama saat baris dalam sdata source

Mempersiapkan EditItemTemplate & InsertItemTemplate

Demikian pula kita dapat membuat EditItemTemplate serta InsertItemTemplate, tapi bukannya label kita akan menggunakan boks teks seperti di bawah ini.

 

 

DataPager adalah kontrol yang bagus untuk beberapa skenario, tapi harus jauh lebih baik. Sepertinya DataPager selalu memilih sumber data yang lengkap (hanya menggunakan sumber data ListView). Yang tidak efisien, bahkan tidak dapat diterima jika Anda memiliki lebih dari 100 halaman. Dalam hal bahwa lebih baik untuk memilih hanya halaman yang ingin ditampilkan, bukannya memilih semua baris dari meja besar. Juga, DataPager hanya bekerja dengan ListView. Hal ini tidak bisa menggunakan Repeater atau DataList. Jika Anda membutuhkan kontrol pager lebih profesional yang bekerja dengan GridView, Repeater, ListView, DataList dan setiap kontrol lainnya, penggunaan dioptimalkan paging dengan prosedur yang tersimpan, abjad, tag atau bahkan fitur seperti nomor vertikal atau roman paging Anda bisa mendapatkan SEO Pager Control, yang terbaik software dalam kategori ini.

 

Mempersiapkan EditItemTemplate & InsertItemTemplate

 

Demikian pula kita dapat membuat EditItemTemplate serta InsertItemTemplate, tapi bukannya label kita akan menggunakan boks teks seperti di bawah ini.

 

 

 

jarhost-banner-new1Alasan Memilih Kami Sebagai Partner ASP.NET Hosting Anda!

  •  Server dan Network yang Handal
  • Control Panel yang User-Friendly
  • Pengalaman di bidang ASP.NET hosting, terutama  Windows Hosting selama bertahun-tahun
  • Teknologi ASP.NET Hosting paling mutakhir
  • Standar security yang amat tinggi

JaringanHosting.com adalah provider ASP.NET dan Windows hosting No #1 di Indonesia. Web Hosting kami mendapatkan Microsoft Spotlight Award dari Microsoft dan ini berdasarkan pada beberapa persyaratan utama, yaitu: WebMatrix, WebDeploy, Visual Studio 2015, ASP.NET 4.6, ASP.NET MVC 6, Silverlight 5 and Visual Studio Lightswitch.

 

Windows Server 2012 Hosting Tips :: Cara Install WebDeploy pada Windows Server 2012

WebDeploy (WebMatrix) adalah web development tool gratis dari Microsoft yang menyatukan server web, database dan programming frameworks menjadi satu. WebMatrix memungkinkan Anda untuk melakukan penulisan program, pengujian sampai publikasi menggunakan ASP.NET atau PHP.

contact us

Salah satu hal yang menarik tentang WebDeploy adalah bahwa kita dapat migrasi situs web kita dari IIS6 dan IIS7 untuk IIS8 dengan mudah. Berikut adalah highlights lagi di WebDeploy sebelum kita melanjutkan ke proses instalasi:

- Kemampuan untuk membuat packages dan me-deploy  atau me-remote mesin mereka secara lokal melalui Visual Studio 2010+
- Terintegrasi dengan Web Matrix
- Kemampuan untuk sinkronisasi dan  atau migrasi aplikasi, situs, atau seluruh web server ke server lain
- Anda dapat mengkonfigurasi backup otomatis sebelum deploying situs baru Anda ke server Anda

Lalu bagaimana cara menginstall WebDeploy pada Windows Server 2012? Ikuti langkah-langkah berikut:

- Gunakan Web Platform Installer untuk memasang WebDeploy dan setup IIS komponen konfigurasi yang diperlukan
- Buat pengguna non-admin lokal pada server Anda deployments
- Konfigurasi “WebDeploy Publishing Settings” di IIS

Untuk menginstall WebDeploy, saya akan menggunakan Microsoft’s Web Platform Installer (WebPI) 4.0. Anda dapat download WebPI disini.

1. Jalankan Installer yang telah diinstall. Dalam kotak pencarian, ketik “Recommended”. Kita ingin memilih “Recommended Configuration for Hosting Providers” dengan mengklik “Add”.

WebPI Installer

Jika Anda mengklik “Items to be installed” link di bagian bawah, Anda dapat melihat daftar aplikasi apa saja yang akan diinstal. Anda pun dapat memilih “X” di samping untuk meghapus apliakasi. Sebagai contoh jika Anda tidak ingin atau tidak perlu PHP dan komponennya Anda dapat menghapusnya.

Perhatikan fitur WebDeploy berikut:

WebDeploy 3.0

Dalam panduan ini, saya akan mengabaikan semua komponen untuk konfigurasi ini. Selanjutnya, klik “Install”. Kemudian, setelah Anda Menerima Perjanjian Lisensi, instalasi Anda akan mulai:

Install WebDeploy

Setelah selesai, Anda dapat menutup WebAPI.

Selanjutnya kita akan membuat pengguna non-admin lokal yang akan kita gunakan dengan WebDeploy. Buka “Server Manager”,  kemudian pilih “Computer Management”.

Server manager

Setelah “Computer Management” selesai di-loads, arahkan ke “Local Users and Groups”, lalu klik kanan Users folder kemudian pilih “New User”. Pada artikel ini, Saya membuat user baru dengan nama “WebDeploy”.

Pastikan Anda mengingat atau menyimpan password ini karena Anda akan membutuhkannya nanti.

webdeploy

Kita juga harus membuat sebuah folder yang berisi untuk Publishing settings nanti. Saya membuat sebuah WebDeploy folder in: C:\Users\WebDeploy. Ini adalah langkah mudah untuk “Publishing Profile management”.

Lalu, buka IIS Manager, Control Panel > Administrative Tools > IIS Manager. Saat IIS Manager dijalankan, Anda akan mendapatkan prompt seperti dibawah ini:

IIS Manager

Klik checkbox “Do not show this message” kemudian pilih “No. Jika Anda memilih “Yes” maka hanya akan membawa Anda kembali ke situs web di mana Anda men-download Web Platform Installer.

Untuk langkah-langkah ini saya juga membuat sebuah website baru. Kita sekarang perlu mengedit WebDeploy Publishing Settings. Untuk melakukan ini, pilih situs Anda dan kemudian klik kanan Deploy > Configure WebDeploy Publishing.

Sekarang kita perlu mengubah beberapa pengaturan pada jendela Configure WebDeploy Publishing:

WebDeploy Configuration Settings

Klik (…) sebelah baris atas yang diawali dengan ServerName\Username. Kita akan mengubahnya ke pengguna WebDeploy baru kita buat sebelumnya.

Sampai tulisan ini di Server 2012 versi RTM, Anda harus memasukkan username di ServerName\Nama dengan mengklik (…) maka fungsi akan menutup IIS. Hal ini tampaknya menjadi bug.

webdeploy1

Setelah Anda memasukkan username, pergi ke baris yang mengatakan ““Specify a location to save the publish settings file” dan ganti path ke folder WebDeploy kita buat sebelumnya. Ubah “C: \Users\Username\” menjadi “C: \inetpub\WebDeploy\”. Lalu klik “Publish”. Sebagai contoh lihatlah gambar berikut:

webdeploy111

Itulah langkah-langkah menginstall WebDeploy pada Windows Server 2012. Semoga bermanfaat.