Control.ClientID Properti
Definisi
Penting
Beberapa informasi terkait produk prarilis yang dapat diubah secara signifikan sebelum dirilis. Microsoft tidak memberikan jaminan, tersirat maupun tersurat, sehubungan dengan informasi yang diberikan di sini.
Mendapatkan ID kontrol untuk markup HTML yang dihasilkan oleh ASP.NET.
public:
virtual property System::String ^ ClientID { System::String ^ get(); };
[System.ComponentModel.Browsable(false)]
public virtual string ClientID { get; }
[<System.ComponentModel.Browsable(false)>]
member this.ClientID : string
Public Overridable ReadOnly Property ClientID As String
Nilai Properti
ID kontrol untuk markup HTML yang dihasilkan oleh ASP.NET.
- Atribut
Contoh
Contoh berikut ini memperlihatkan kontrol pengguna Web yang berada di dalam halaman konten untuk halaman master. Kontrol pengguna berisi DropDownList kontrol dan Label kontrol. Teks yang ditampilkan dalam Label kontrol ditentukan oleh nilai yang dipilih pengguna dari DropDownList kontrol. Nilai teks diatur melalui skrip klien sehingga halaman Web tidak harus memposting kembali ke server untuk mengatur nilai ini. Untuk mendapatkan referensi ke elemen HTML yang dirender untuk Label kontrol dalam skrip klien, Anda harus mengetahui nilai properti kontrol ClientID . Namun, karena kontrol pengguna dapat diletakkan di mana saja di halaman Web, tidak mungkin untuk mengetahui terlebih dahulu kontainer penamaan mana yang akan berisi kontrol. Untuk memastikan bahwa ClientID nilainya akan sama ID dengan nilai , kode menetapkan nilai ke ClientIDModeStatic.
Contoh berikut menunjukkan kontrol pengguna.
<%@ Control AutoEventWireup="true" %>
<script type="text/javascript">
var seasonalSports = new Array("None selected",
"Tennis",
"Volleyball",
"Baseball",
"Skiing");
function DisplaySport(x) {
document.getElementById("SelectedSport").innerHTML
= seasonalSports[x];
}
</script>
<asp:DropDownList ID="DropDownList1" runat="server"
onchange="DisplaySport(this.selectedIndex);">
<asp:ListItem Value="Select a season"></asp:ListItem>
<asp:ListItem Value="Spring"></asp:ListItem>
<asp:ListItem Value="Summer"></asp:ListItem>
<asp:ListItem Value="Autumn"></asp:ListItem>
<asp:ListItem Value="Winter"></asp:ListItem>
</asp:DropDownList>
<br />
<asp:Label ID="SelectedSport" runat="server" ClientIDMode="Static">
</asp:Label>
Contoh berikut menunjukkan halaman konten yang berisi kontrol pengguna.
<%@ Page Title="" MasterPageFile="~/Seasons.master" AutoEventWireup="true" %>
<%@ Register Src="Seasons.ascx" TagName="Seasons" TagPrefix="uc1" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="Server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="Server">
<uc1:Seasons ID="Seasons1" runat="server" />
</asp:Content>
Contoh berikut menunjukkan halaman master yang berisi halaman konten.
<%@ Master AutoEventWireup="true" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<asp:ContentPlaceHolder id="head" runat="server">
</asp:ContentPlaceHolder>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ContentPlaceHolder id="ContentPlaceHolder1" runat="server">
</asp:ContentPlaceHolder>
</div>
</form>
</body>
</html>
Keterangan
Ketika kontrol server Web dirender sebagai elemen HTML, id
atribut elemen HTML diatur ke nilai ClientID properti . Nilai ClientID sering digunakan untuk mengakses elemen HTML dalam skrip klien dengan menggunakan document.getElementById
metode . ID juga sering digunakan dalam aturan CSS untuk menentukan elemen ke gaya. Misalnya, aturan gaya CSS berikut memilih semua span
elemen yang memiliki id
nilai ProductIDLabel
atribut dan mengatur atributnya background-color
ke white
:
span#ProductIDLabel { background-color: white; }
ASP.NET menyediakan beberapa algoritma tentang cara menghasilkan ClientID nilai properti. Anda memilih algoritma mana yang akan digunakan untuk kontrol dengan mengatur propertinya ClientIDMode . Algoritma diidentifikasi oleh ClientIDMode nilai enumerasi yang tercantum dalam tabel berikut.
Nilai | Deskripsi |
---|---|
AutoID | Nilai ClientID dihasilkan dengan menggabungkan ID nilai setiap kontainer penamaan induk dengan ID nilai kontrol. Dalam skenario pengikatan data di mana beberapa instans kontrol dirender, nilai bertahap disisipkan di depan nilai kontrol ID . Setiap segmen dipisahkan oleh karakter garis bawah (_). Algoritma ini digunakan dalam versi ASP.NET yang lebih lama dari ASP.NET 4. |
Static | Nilai ClientID diatur ke nilai ID properti . Jika kontrol adalah kontainer penamaan, kontrol digunakan sebagai bagian atas hierarki penamaan kontainer untuk kontrol apa pun yang dikandungnya. |
Predictable | Algoritma ini digunakan untuk kontrol yang berada dalam kontrol terikat data. Nilai ClientID dihasilkan dengan menggabungkan ClientID nilai kontainer penamaan induk dengan ID nilai kontrol. Jika kontrol adalah kontrol terikat data yang menghasilkan beberapa baris, nilai bidang data yang ditentukan dalam ClientIDRowSuffix properti ditambahkan di akhir. GridView Untuk kontrol, beberapa bidang data dapat ditentukan. ClientIDRowSuffix Jika properti kosong, angka berurutan ditambahkan di akhir, bukan nilai bidang data. Setiap segmen dipisahkan oleh karakter garis bawah (_). |
Inherit | Kontrol mewarisi ClientIDMode pengaturan kontrolnya NamingContainer . |
Nilai ClientIDMode default untuk halaman adalah Predictable. Nilai ClientIDMode default untuk kontrol adalah Inherit. Karena default untuk kontrol adalah Inherit, mode pembuatan default adalah Predictable. (Namun, jika Anda menggunakan Visual Studio untuk mengonversi proyek Web ke ASP.NET 4 dari versi yang lebih lama, Visual Studio secara otomatis mengatur default situs ke AutoID dalam file Web.config.)
Untuk informasi lebih lanjut, lihat Identifikasi Kontrol Server Web ASP.NET.
Berlaku untuk
Lihat juga
- NamingContainer
- ID
- INamingContainer
- Identifikasi Kontrol ASP.NET
- Cara: Kontrol Akses dari JavaScript menurut ID
- Panduan: Membuat Kontrol Data-Bound Lebih Mudah Diakses dari JavaScript
- Panduan: Membuat Kontrol yang Terletak di Kontrol Pengguna Web Lebih Mudah Diakses Dari JavaScript
- Skrip Klien di Halaman Web ASP.NET